javascript - Angular ngClass 评估

标签 javascript angularjs ng-class

我一直在学习 AngularJs 并构建了一个非常基本的 Angular 应用程序。在应用程序的一部分中,我使用了 ngClass在像

这样的 div 元素处
<div ng-class='{"some class": aFuncTruthyOrFalsy()}'>
<!-- aFuncTruthyOrFalsy() is defined in the controller for this view-->

现在, View 中存在一个与上述元素无关的输入元素,并且与上述函数中检查的任何值根本不相关。

我注意到每当我在输入字段中输入一些内容(更改事件、按键事件)时,它都会导致 ngClass 的重新评估。 (我已将控制台日志放入 aFuncTruthyOrFalsy 函数内)。我无法确定哪些事件正在冒泡以导致重新评估。

在我看来,ngClass 会在页面中的每个事件中重新评估。

有人可以解释/详细说明这种行为吗?

是否可以在 View 初始加载时缓存评估的类?

如果在同一个 View 中使用多个 ngClass 并且每个表达式求值都委托(delegate)给某个函数,该函数再次执行一些多重操作来获取求值表达式,该怎么办?

最佳答案

Angular 绑定(bind)使用 $watch 来监视函数值的变化。摘要循环正在调用您的函数来将结果与最后一个值进行比较。

这篇文章很好地解释了这一点 http://tutorials.jenkov.com/angularjs/watch-digest-apply.html#watch

我建议绑定(bind)到范围变量而不是函数。即在作用域中有一个变量将存储该函数的结果,并且您可以在需要时更新它。

毕竟您可能不想从您的 View 中调用方法。您当前的设置为使整个 MVC 概念无效敞开了大门,例如后来有人在该方法中添加了原本应该只是 setter/getter 的功能。

关于javascript - Angular ngClass 评估,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30754786/

相关文章:

javascript - Angular js 根据几个条件对项目列表进行排序

javascript - 动态平滑切换颜色

angularjs - 仅将类添加到 AngularJS 中的特定 ng-repeat

javascript - cypress 登录后等待重定向

javascript - 自调用匿名函数格式之间的差异

php - 使用带有 ',' 复选框的两个值并使用 php[code igniter] 保存,使用 'Javascript' 计算

javascript - 如何实现具有尾随无限滚动的 ui-grid

javascript - 延迟加载有时在 Angular 上不起作用

angularjs - Angular Bootstrap 中 append-to-body 的原因是什么?

angularjs - Angular 滚动指令