angular.js - angularjs 的操作dom一般如何写在指令或者服务中？

Question

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

Answer 1

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

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

Answer 2

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

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

Answer 3

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

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

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