Question

我有一个选择：

<select ng-model="p.value" ng-options="q for q in p.value">
<option value="">Select an animation</option>
</select>

p.value为['AAAAA', 'BBBBB', 'CCCCC']，但当我选择一个选项时，选择更新并显示一组新的选项，如：

<option>A</option>
<option>A</option>
<option>A</option>
<option>A</option>
<option>A</option>

我显然通过在模型和选项中使用相同的值来构造错误。做事的正确方法是什么？

Answer 1

您需要分离项目数组和模型

<div ng-app ng-controller="MyCtrl">
    <select ng-model="p.selected" ng-options="q for q in p.value">
        <option value="">Select an animation</option>
    </select>
    {{p.selected}}
</div>

function MyCtrl($scope) {

    $scope.p = {
        value: ['AAAAA', 'BBBBB', 'CCCCC'],
        selected : null
    };
}

您的示例中发生的事情是，只要您选择AAAAA p.value现在引用字符列表，并且ng-options绑定到相同的$scope属性下拉列表更新并生成您看到的结果。

<强> Example on jsfiddle

如何递归阻止AngularJS绑定？

1 个答案: