Управление DOM в angularJS: лучшая практика?
Мы создаем большое веб-приложение, используяAngularJS
, Мы часто используем пользовательские директивы для разных случаев. Когда дело доходит до манипулирования DOM, события привязки и т. Д. ... бывает, что мы определяем функции, которые манипулируют DOM в пользовательской директивеlink
функция, но мы вызываем ее из контроллера (мы определяем функции в$scope
так что это может быть доступно данному контроллеру). Я думаю, что угловой способ сделать это - определить отдельную пользовательскую директиву для каждой функции и использовать ее непосредственно из шаблона, но в нашем случае я не знаю, до какой степени это будет удобно, мы уже много пользовательских директив, поэтому ПЛОХО делать то, что мы делаем (определяя функцию, которая манипулирует DOM в директиве и вызывает ее из контроллера), имеет ли это смысл, или мы манипулируем DOM в контроллере ? Для нас это своего рода разделение интересов, мы никогда не определяем функцию, которая манипулирует DOM в контроллере, только в директиве, но вызов ее из контроллера не кажется таким правильным, не так ли?
Пример, показывающий, как выглядит наша пользовательская директива:
angular.module('exp', []).directive('customdirectiveExp', ['', function(){
// Runs during compile
return {
name: 'customDirectiveExp',
controller: "ControllerExp",
controllerAs: "ctrl",
templateUrl: 'templateExp',
link: function($scope, iElm, iAttrs, controller) {
/* These function will be called from the ControllerExp when it needs so.
Function can do any things like manipulating the DOM, addin
event listner ...
*/
scope.manipulateDom1 = function(){
// DOM manipualtion
};
scope.manipulateDom2 = function(){
// DOM manipualtion
};
scope.manipulateDom3 = function(){
// DOM manipualtion
};
}
};
}]);