Mic*_*mza 32 model-view-controller angularjs
在AngularJS中,我注意到注入了一个控制器$element,它是控制器控制的元素的JQuery/JQLite包装器.例如:
<body ng-controller="MainCtrl">
然后,您可以通过注入访问控制器中的body元素 $element
app.controller('MainCtrl', function($scope, $element) { ...
这可以在Plunkr工作.
并且似乎被确认为$ compile的文档中的故意功能
我的问题是:
根据各种指南和教程,建议您不要在控制器中访问DOM,为什么这可能呢？
是否有任何非hacky用例？
在某处可用的代码中是否有任何这样的例子？
谢谢.
alo*_*d05 15
一个可扩展和/或与其他指令交互的编写良好的指令将具有一个控制器.该控制器需要访问DOM,因为它是定义该指令的功能的地方.指令实际上是将控制器/范围绑定到页面上元素的不同方式; 向DOM添加功能的首选方法.据我所知,最佳做法是:不要同时使用控制器和链接功能.所以指令控制器需要一个$element.
根据各种指南和教程,建议您不要在控制器中访问DOM,为什么这可能呢？
一旦你深入了解它们的运作方式,这些指南就会有点误导.
控制器处理定义函数并分配视图使用的变量.将这些函数和变量绑定到视图的正确方法是使用指令.这是我对最佳实践的理解,在过去的一年里,它与大型和不断增长的角度应用程序一起工作.
棘手的是该指令基本上将控制器绑定到DOM. ng-model是一个指令,并有一个控制器,可以从其他指令访问.如果您执行添加自定义验证功能等操作,则需要利用此功能.该指令的该控制器应该操纵DOM.因此,通用控制器实际上是一组超级视图控制器; 教程通常会釉面的细节.
是否有任何非hacky用例？
$element:例如,在指令的控制器中使用它.
在某处可用的代码中是否有任何这样的例子？
Angular源代码虽然可能有点密集,但是代码很好且评论很好.可能需要一点点才能看到正在发生的事情,但通常会提供相当丰富的信息.
NgModelController(复杂示例) https://github.com/angular/angular.js/blob/master/src/ng/directive/input.js https://github.com/angular/angular.js/blob/master/ SRC/NG /指令/ input.js#L1660
什么可能是一个简单的例子,但使用编译函数,eventDirectives(ng-click例如),
https://github.com/angular/angular.js/blob/master/src/ng/directive/ngEventDirs.js#L3
无论是否注入$ element,控制器的作用域都绑定在该元素上.
angular.element('#element-with-controller').scope();
Angular围绕指令.这是在MVC中将事物粘合在一起的东西.如果你考虑一下,ng-controller本身就是一个指令.
我想当你将单个控制器用于多个指令时,这可以派上用场.
.controller('MyController', function($scope, $element){
$scope.doSomething = function(){
// do something with $element...
}
})
.directive('myDirective1', function(){
return {
controller: 'MyController'
}
})
.directive('myDirective2', function(){
return {
controller: 'MyController'
}
})
每个指令都有一个指定控制器的新实例,但基本上共享它的属性,依赖关系.
我写了一次表单处理程序控制器,用于注册/登录/联系人等.
实际上， $element 被注入是因为您将其指定为参数列表中的依赖项。如果将其从列表中删除，则不会注入它。
http://plnkr.co/edit/CPHGM1awvTvpXMcjxMKM?p=preview
正如所评论的，在某些情况下，您需要控制器中的 $element ，尽管我目前想不到任何。
| 归档时间： |
|
| 查看次数： |
49902 次 |
| 最近记录： |