在 ng-repeat 中由 ng-click 调用的赋值表达式的行为 [英] Behavior of assignment expression invoked by ng-click within ng-repeat
问题描述
我正在尝试使用附加到 <p> 的 ng-click 更新我的模型.
我对ng-repeat的外部赋值表达式没有问题，或者在内部调用作用域方法没有问题ng-重复.但是，如果我在 ng-repeat 中使用 inside 赋值，它似乎被忽略了.我在 Firefox 控制台中没有看到任何消息报告，但还没有尝试设置断点以查看事件是否被触发.
<头><title>ng-click 的测试</title><script type='text/javascript' src='http://code.angularjs.org/1.1.1/angular.js'></script><script type='text/javascript'>//<![CDATA[函数 MyCtrl($scope) {$scope.selected = "";$scope.defaultValue = "测试";$scope.values = ["foo", "bar", "baz"];$scope.doSelect = function(val) {$scope.selected = val;}}//]]><body ng-app><div ng-controller='MyCtrl'><p>Selected = {{selected}}</p><小时/><p ng-click='selected = defaultValue'>点击我</p><小时/><p ng-repeat='value in values' ng-click='selected = value'>{{value}}</p><小时/><p ng-repeat='value in values' ng-click='doSelect(value)'>{{value}}</p></html>
Fiddle 这里，如果您愿意的话(以及一些早期的变体).>
指令 ngRepeat 为每次迭代创建一个新的作用域，因此您需要在父作用域中引用您的变量.
使用$parent.selected = value，如:
<p ng-repeat='value in values' ng-click='$parent.selected = value'>{{value}}</＞注意:函数调用由于原型继承而传播.
如果您想了解更多信息:范围原型继承的细微差别.
I'm attempting to update my model using ng-click attached to a <p>.
I have no problem with an assignment expression outside of an ng-repeat, or with calling a scope method inside the ng-repeat. However, if I use an assignment inside the ng-repeat, it appears to be ignored. I don't see any messages reported in the Firefox console, but haven't tried setting breakpoints to see if the event is being fired.
<!DOCTYPE html>
<html>
<head>
<title>Test of ng-click</title>
<script type='text/javascript' src='http://code.angularjs.org/1.1.1/angular.js'></script>
<script type='text/javascript'>//<![CDATA[
function MyCtrl($scope) {
$scope.selected = "";
$scope.defaultValue = "test";
$scope.values = ["foo", "bar", "baz"];
$scope.doSelect = function(val) {
$scope.selected = val;
}
}
//]]>
</script>
</head>
<body ng-app>
<div ng-controller='MyCtrl'>
<p>Selected = {{selected}}</p>
<hr/>
<p ng-click='selected = defaultValue'>Click me</p>
<hr/>
<p ng-repeat='value in values' ng-click='selected = value'>{{value}}</p>
<hr/>
<p ng-repeat='value in values' ng-click='doSelect(value)'>{{value}}</p>
</div>
</body>
</html>
Fiddle is here, if you prefer (along with a couple of earlier variants).
Directive ngRepeat creates a new scope for each iteration, so you need to reference your variables in parent scope.
Use $parent.selected = value, as in:
<p ng-repeat='value in values' ng-click='$parent.selected = value'>{{value}}</p>
Note: Function call propagates due to prototypal inheritance.
If you want to learn more: The Nuances of Scope Prototypal Inheritance.
这篇关于在 ng-repeat 中由 ng-click 调用的赋值表达式的行为的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
