angularjs – 改变控制器内的模型对象以操纵DOM – 角度js-最佳

发布时间：2020-12-17 17:48:09 所属栏目：安全来源：网络整理

导读：在阅读下面的帖子并在角度js上工作一段时间后,我有一个简单的问题. 帖子：no dom manipulation from angular js controllers 关注点(来自帖子)：不要使用控制器操纵DOM – 控制器应仅包含业务逻辑.将任何表示逻辑放入控制器会显着影响其可测试性. Angular对

在阅读下面的帖子并在角度js上工作一段时间后,我有一个简单的问题.

帖子：no dom manipulation from angular js controllers

关注点(来自帖子)：不要使用控制器
操纵DOM – 控制器应仅包含业务逻辑.将任何表示逻辑放入控制器会显着影响其可测试性. Angular对大多数情况和指令进行数据绑定以封装手动DOM操作.

问题：如果我有一个简单的角度应用程序和按钮单击我调用我的控制器的功能.在该函数中,我想做一些简单的业务逻辑,并根据业务逻辑输出我想隐藏/显示一个按钮.

什么是最好的方法.

我目前的做法是：PLUNKER EXAMPLE
(这种做事的方式是否会破坏角度js领域的规律.是否反对测试？
请纠正我)

解决方法

Angular指南没有说“不要使用控制器来操纵dom”,因为你不应该因控制器中的某些东西而改变dom – 而是你永远不应该在控制器中直接修改dom .不要使用document.getElementById,不要使用$(“#element”)等 – 永远不要谈论dom,让你的模型通过将模型绑定到dom来处理它.

当你发现自己处于想要使用jQuery直接在控制器中与dom对话的情况时,就应该查看指令了. http://docs.angularjs.org/guide/directive

我同意@tasseKATT,将重置按钮代码上的ng-click代码移动到一个函数中 – 即使只是为了理智.

编辑

这可以测试吗？是的 – 远比将内容放入HTML或直接依赖/修改DOM更重要.

在这种情况下,您需要测试的是您的范围函数执行它们应该做的事情 – 并且相信Angular人员已经测试了它们的绑定按照记录的方式工作的事实.您不必测试ng-click调用您的函数,您必须在使用您的函数所执行的任何参数调用时测试它,您的规范应该如此.

至于更容易在内联或在document.ready等中编写这种类型的代码 – 这只是习惯Angular处理方式的一部分.来自多年来与jQuery绑定,它肯定需要一些习惯.我认为以旧的方式做这件事更难.

查看本网站上关于测试Angular的帖子 – 有关于测试控制器,指令,服务等的文章 – 真的帮我把它们整合在一起. http://www.benlesh.com/2013/05/angularjs-unit-testing-controllers.html

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!