我已经花了几个小时尝试对这段代码进行细微的修改,但我不明白为什么一个可行而另一个却不可行。
这是场景:我试图显示一个注册用户列表(我通过一个简单的数据库查询得到该列表,该查询仅返回几列),然后当单击一个用户名时,我将检索有关以下内容的更多信息从数据库中找到该用户,并以其他 View 显示该用户。目前,我正在使用带有<a>
指令的常规ng-click
元素来设置此值,该指令设置了一个称为currentid
的值。在我的代码的其他地方,每当$watch()
更改时,我都使用currentid
发出新的数据库查询。该部分似乎正在工作(我从watch回调中看到console.log()
输出,并且数据库查询正在吐出正确的数据)...但是有时currentid
发生了变化,有时却没有,并且我不知道为什么。
(点击表中的“rmunn”和“admin”链接:下面的“Currrent ID”值应更新。请原谅几乎完全没有CSS;我是编码器,而不是图形设计师(“Dammit,吉姆!”),现在在我所在的时区也很晚,所以我没有动力去完善它。它的功能正常,可以说明问题所在,我将不去讨论它了。)
两者之间的唯一区别是,一个绑定(bind)到
currentid
,另一个绑定(bind)到vars.currentid
。现在,我了解了为什么在父级和子级作用域的情况下绑定(bind)currentid
无效(子级的值会覆盖父级的值);因为我来自Python背景,所以这对我来说很有意义(这类似于Python的实例 namespace 如何遮蔽类中定义的任何 namespace 的方式)。但是在这个jsfiddle中,我仅使用一个 Controller -这些变量不是都在同一个作用域中吗?我整天都在反对这个问题,我尝试阅读的几个Stack Overflow答案(例如How does data binding work in AngularJS?)让我更加困惑:
$apply()
和$digest()
以及范围,哦,我的天!因此,如果有人能给我关于Angular范围的简单入门指南(或将我指向我已经错过的已经写好的指南),我将不胜感激。我想:“我已经学习了Clojure和Haskell,可以学习一个简单的Javascript框架。” “这很容易。”男孩,我错了。 :-)
最佳答案
您遇到了一个问题,其中ng-repeat
创建了子作用域。
<tr ng-repeat="user in data" blarg="{{user.id}}">
<!-- currentid here is part of the ng-repeat child scope
and not your root scope -->
<td><a href="#{{user.id}}" ng-click="currentid = user.id">{{user.userName}}</a></td>
<td>{{user.email}}</td>
</tr>
如果您需要访问父范围,则可以使用
$parent.currentid
<a href="#{{user.id}}" ng-click="$parent.currentid = user.id">{{user.userName}}</a>
每当您在 Angular 世界之外修改值时,都需要使用
$apply()
。例如,使用setTimeout()
或jQuery插件。调用$apply()
会通知Angular重新评估scope
,以查看是否有任何更改并相应地进行更新。