Перемещение функции от контроллера к директиве

У меня есть функция в моем контроллере, которая управляет DOM. Я понимаю, что это плохая практика, и манипуляции с DOM должны быть преобразованы в директиву. У меня возникли проблемы с выводом его из контроллера и его собственной директивой.Перемещение функции от контроллера к директиве

У меня есть следующий пример кода в мой контроллер:

$scope.sidebarToggle = function() { 
    if ($scope.request = null) { 
    $(#container).switchClass('bottom', 'top', 400, 'linear'); 
    $scope.editing = true; 
    } 
    else { 
    $(#container).switchClass('top', 'bottom', 400 'linear'); 
    $scope.editing = false; 
    { 
};

если условия очень упрощена, в прямом коде Есть несколько условий, приведенный выше код в. В противном случае могла бы быть указана ng-show/hide.

Целью кода является распознавание состояния, в котором находится пользователь, открытие/скрытие боковой панели вне экрана (назначения класса) и установка состояния «редактирования» контроллера.

Как это может быть реорганизовано в директиву для достижения той же цели?

источник

2015-09-22 Flignats

является контейнером в том же объеме? – gaurav5430

Для начала ознакомьтесь с документацией по угловым директивам. https://docs.angularjs.org/guide/directive

Для «угловатости» класса контейнера используйте ng-класс.

пример @Adding multiple class using ng-class

источник

2015-09-22 18:35:52

Привет, Джей - Спасибо, я определенно читал документы и пытался переместить код, но только что застрял на нем. Я часто использую директиву ng-class, но я считаю, что логика, которую я имею, слишком сложна и/или лучше подходит в пользовательской директиве. – Flignats

Не знаете, нужны ли вам в этом случае директивы. Вы могли бы улучшить приведенный выше код, просто переместив настройку класса на угловую разметку и установив только базовую переменную углового диапазона в контроллере. –

Вы, вероятно, не нужно, чтобы создать свою собственную директиву для этого.

Угловые уже созданы некоторые директивы, которые могут вам помочь.

В вашем случае, вы должны использовать угловую директиву: нг-шоу и нг-класс или нг-стиль

Exemple:

HTML

<div ng-show="request == null"> Edit </div> 
<div ng-class="{'class-top': request == null,'class-bottom' : request != null}"> <div>

CSS:

.class-top{ 
... 
} 
.class-bottom{ 
... 
}

Сообщите мне, если он сработает для вас,

Нико

источник

2015-09-22 18:44:10 Nicolas2bert

-1

Попробуйте это:

app.directive('test', function() { 
    return { 
    restrict: 'E', 
    scope: { 

    }, 
    link: sidebarToggle 
    }; 
});

Я думаю, что это создает директиву и ссылку на вашу функцию sidebarToggle

источник

2015-09-22 18:45:52 zif

Перемещение функции от контроллера к директиве

ответ

Смежные вопросы