首页 > angularjs 的操作dom一般如何写在指令或者服务中?

angularjs 的操作dom一般如何写在指令或者服务中?

用angular一直将数据的操作在controller中执行,代码看上去比较臃肿并且难以维护,是否有最佳实践的案例~感谢~


某种意义上或者是“约定”,DOM操作只能出现在指令中。最不应该出现的位置就是服务中。Angular倡导以测试驱动开发,在你的service或者controller中出现了DOM操作,那么也就意味着你的测试是无法通过的。当然,这只是一点,重要的是使用Angular的其中一个好处是啥,那就是双向数据绑定,这样你就能专注于处理业务逻辑,无需关系一堆堆的DOM操作。如果你在Angular的代码中还到处充斥着各种DOM操作,那为什么不直接使用jquery去开发呢。

我自己也写过一个示例,或许对你有帮助:https://github.com/dolymood/angular-example


单纯的操作dom,还是放在directive里比较好,涉及数据crud对应DOM的还是通过模板与控制器绑定之后,在controler中直接操作scope比较好,一些响应动画,可以在directive里绑定事情,然后再controler中广播事件控制directive中相应的动画,这里有一份比较完整的angular的项目,是我14年入门angular时看的,学到了很多,与你分享下,希望对你有所帮助

https://github.com/atian25/wandoujia-satan


  1. 所有跟视图显示有关的逻辑放到directive中,只有directive可以操作dom。
  2. 所有跟页面数据有关的逻辑放到和该页面绑定的controller中。
  3. 所有通用的数据逻辑放到service中。

Angular其实是把一些本来后端干的活逻辑提到前端来了。

一个经典的例子:todomvc and 源码

【热门文章】
【热门文章】