Javascript ng在ng重复中单击

在AngularJS中，我有一组颜色，它们有

标题

和

类型

。我将所有颜色显示为一个列表

<ul>
    <li>
        <a href="" ng-click="search.type = 'primary';">
            Primary
        </a>
    </li>               
</ul>

现在我想添加一个菜单，允许用户选择仅显示特定

类型的颜色。为此，我有另一个包含colortypes的数组。这也显示为一个列表

<ul>
    <li>
        <a href="" ng-click="search.type = 'primary';">
            Primary
        </a>
    </li>               
</ul>

现在，我想单击一个颜色类型，将颜色列表缩小为仅包含选定的
color.type
的颜色。为此，我使用了一个过滤器：

<ul>
    <li ng-repeat="color in colors | filter:search">
        {{ color.title }}
    </li>
</ul>

<ul>
    <li>
        <a href="" ng-click="search.type = 'primary';">
            Primary
        </a>
    </li>               
</ul>



{{color.title}}



使用手动颜色类型列表，一切正常：

<ul>
    <li>
        <a href="" ng-click="search.type = 'primary';">
            Primary
        </a>
    </li>               
</ul>






但是，当我使用如上所述的颜色类型数组时，单击不起任何作用：

<ul>
    <li>
        <a href="" ng-click="search.type = 'primary';">
            Primary
        </a>
    </li>               
</ul>

<ul>
    <li ng-repeat="colortype in colortypes">
        <a href="" ng-click="search.type = '{{ colortype.title }}';">
            {{ colortype.title }}
        </a>
    </li>               
</ul>






我想这与ng重复中的ng点击有关（或者可能是
=
分配的范围）？如何解决此问题？
在
ngClick
指令中，您指定的不是JS代码，而是表达式

<ul>
    <li>
        <a href="" ng-click="search.type = 'primary';">
            Primary
        </a>
    </li>               
</ul>

因此，您只需使用
即可（注意：
{{}
无插值）
由于
ng repeat
创建子作用域，
ng click
引用的是子作用域，而不是控制器的作用域。这里有两种方法可以解决这个问题

<ul>
    <li>
        <a href="" ng-click="search.type = 'primary';">
            Primary
        </a>
    </li>               
</ul>

1）一种快速而肮脏的方法是使用
$parent
访问原始作用域

<ul>
    <li>
        <a href="" ng-click="search.type = 'primary';">
            Primary
        </a>
    </li>               
</ul>

将您的
ng单击更改为类似以下内容：

<ul>
    <li>
        <a href="" ng-click="search.type = 'primary';">
            Primary
        </a>
    </li>               
</ul>

<a href="#" ng-click="$parent.search.type = colortype.title;">
    {{ colortype.title }}
</a>

不，它不起作用。即使使用
search.type='primary'
，如果将它放在
ng repeat
中，它也不会工作。正如我所说，我认为这可能是一个作用域问题？在控制器中初始化
$scope.search={}
，使
search
对象可用于
ngRepeat
创建的子作用域。刚刚在plnkr上进行了测试，它可以正常工作（如果您仍然不能这样做，我可以再次创建plnkr）。不要忘记，AngularJS使用
原型继承
，所以如果父范围中有
搜索
对象，表达式将使用它。如果否，则它将在每个子作用域中创建新对象，由
ngRepeat
创建。
<ul>
    <li>
        <a href="" ng-click="search.type = 'primary';">
            Primary
        </a>
    </li>               
</ul>