当前位置: 首页 > 面试题库 >

在ng-repeat中由ng-click调用的赋值表达式的行为

拓拔谭三
2023-03-14
问题内容

我正在尝试使用ng-click附加到的方式更新我的模型<p>

我有一个赋值表达式没有问题 ng-repeat,或者与调用方法的范围 ng-repeat。不过,如果我使用赋值 里面
ng-repeat,它似乎被忽略。我没有在Firefox控制台中看到任何消息报告,但是还没有尝试设置断点来查看是否触发了该事件。

<!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>

小提琴在这里,如果您愿意的话(还有几个早期的变体)。


问题答案:

指令ngRepeat为每次迭代创建一个新作用域,因此您需要在父作用域中引用变量。

使用$parent.selected = value,如:

<p ng-repeat='value in values' ng-click='$parent.selected = value'>{{value}}</p>

注意:函数调用由于原型继承而传播。

如果您想了解更多信息:范围原型继承的细微之处。



 类似资料:
  • 问题内容: 我正在使用AngularJS,并且假设它可以工作(不起作用),我想获得的效果将类似于它将产生的效果。 视图 控制者 我意识到该代码将无法使用,因为它不可用,因为它将仅可用于每一行内的对象。该代码是为了让我了解正在尝试做的事情:即。我希望能够使用其类也基于条件的表行来创建,该条件取决于对行本身的范围功能的访问。。我意识到我 可以 在列上添加ng- class,但这很无聊。有人有更好的主意

  • 问题内容: 我正在开发一个页面,我需要在其中显示一些框(使用),其中包含频道信息以及显示位置(城市)。 我面临的问题是当我重复第二遍时: 这应该获得第一个ng-repeat的$ index值,并使用显示频道的位置创建一个新数组。它确实做到了。但是,当我使用此数组应用第二个ng- repeat时,它无法正常工作。 说我的html看起来像这样(PS:我需要使用索引值而不是因为我将这些框放到列中) JS

  • 问题内容: “活动”类的CSS来自引导程序。 因此,切换作品几乎是我想要的。我希望它类似于导航链接中的活动状态,但在我的示例中,它处理图像,因此需要担心url字符串等。 我尝试模拟此示例,但没有用(我尝试了相同的图像逻辑):ng-class突出显示基于ng- repeat的活动菜单项,如果有人能指出我正确的方向,我将不胜感激。:D 问题答案: 在您遇到的情况下,我要做的是在ng-repeat的父范

  • 问题内容: 我正在尝试将模型中的数据插入模板,但是我想每7次重复添加一个新的表行。使用基于strign的模板,我可以使用迭代索引和模来相当容易地做到这一点,但是我无法弄清楚如何使用angular的DOM模板来做到这一点。 这是HTML: 而javascript类似于: 您可以在JSFiddle中查看以下代码:http : //jsfiddle.net/3zhbB/2/ 问题答案: 请与天数组的数组

  • 问题内容: 我试图了解over 的意义。角度文档提供了以下示例 但是,使用, 有人可以解释。的意义吗?谢谢。 问题答案: 这两个指令的含义相似:它们重复HTML标记。所不同的只是,在您的帮助下,您可以重复几个标签,从标签开始于,再到完成于。 例如,您有下一个代码: 因此,现在我们可以为这些代码添加2个指令。 与: 与和: 因此,现在您可以看到,在第一种情况下,仅使用指令重复,但是在第二种情况下,您

  • 问题内容: 嗨,我有一个简单的ng-repeat-start和end用例,并且工作正常,当我想添加一个内部ng-repeat时出现了问题。这是我的代码 内部ng-repeat到td元素中不起作用,在检查html源代码时看到ngRepeat注​​释,但未创建td元素。 我的丑陋的解决方法(假设我知道该向量的大小)是: 问题答案: 从那时起,我不确定是否使用角度1.1.6,并且在1.1.5或1.0.7