NG-重复内调用分配前pression行为NG-点击 [英] Behavior of assignment expression invoked by ng-click within ng-repeat

查看:132
本文介绍了NG-重复内调用分配前pression行为NG-点击的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我试图用更新我的模型 NG-点击连接到< P>

I'm attempting to update my model using ng-click attached to a <p>.

我有一个的的以外的转让前pression的没有问题纳克重复,或与呼叫范围,方法的的的 NG-重复。不过,如果我使用赋值的的的 NG-重复,它似乎被忽略。我没有看到在Firefox的控制台报告的任何消息,但没试过设置断点,看是否是被解雇的事件。

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>

小提琴是这里,如果preFER(一对夫妇早期的变种一起)。

Fiddle is here, if you prefer (along with a couple of earlier variants).

推荐答案

指令ngRepeat会为每个迭代一个新的范围,所以需要引用父范围的变量。

Directive ngRepeat creates a new scope for each iteration, so you need to reference your variables in parent scope.

使用 $ parent.selected =值,如:

<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-重复内调用分配前pression行为NG-点击的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆