2

我有多个选择框，我正在使用 Angular JS。每个选择框需要有不同的选择值。到目前为止，我所看到的所有元素都具有共享相同选定值的元素。为了实现这一点，使用了范围。因为我可能有数百个下拉菜单......实际上有数千个......这里的正确方法是什么？为每个人创建一个范围？尝试让一个范围随着每个选择框而变化？

这是我拥有的jsfiddle的示例。

任何帮助深表感谢。
谢谢


function MyCntrl($scope) {
$scope.colors = [
    {name:'black'},
    {name:'red'},
    {yellow:'yellow'}
]
$scope.isSel = $scope.colors[1];
}
4

2 回答 2

2

不确定我已经弄清楚你到底想要什么。据我了解，您需要每个选择框具有不同的值。因此，您需要将每个选择框绑定到不同的变量。

<div ng-app="myApp">
  <div ng-controller="myCtrl">
    <hr/>
    <div ng-repeat="n in [] | range: selectionsCount">
        <select ng-model="selectedValues[$index]" ng-options="c.name for c in colors"></select>
    </div>
    {{ selectedValues }}
  </div>
</div>

举个更清楚的例子，我在这里设置了选择框计数变量。

angular.module('myApp', [])
    .controller('myCtrl', function ($scope) {
        $scope.colors = [
            {name: 'black'},
            {name: 'red'},
            {name: 'yellow'}
        ];
        $scope.selectedValues = [];
        $scope.selectionsCount = 5;
    })
    .filter('range', function () {
        return function(input, total) {
            total = parseInt(total);
            for (var i=0; i<total; i++)
                input.push(i);
            return input;
        };
    });

你可以在这里测试它：http: //jsfiddle.net/zmU8R/7/ 如果我误解了你的问题，请随时纠正我。

于 2013-02-08T16:25:24.417 回答
2

您需要将每个选择框绑定到它自己的范围。您可以手动完成，将每个对象绑定到一个新对象而不是同一个 isSel，或者您可以使用 ng-repeat，如下所示：

http://jsfiddle.net/zmU8R/9/

html:

<div ng-app="">
  <div ng-controller="MyCntrl">
      <div ng-repeat="control in controls">
          <select ng-model="control.isSel" ng-options="c.name for c in colors"></select><br />
      </div>
      <hr />
      <div ng-repeat="control in controls">
          {{control.id}}: {{control.isSel}}
      </div>
  </div>
</div>

脚本：

function MyCntrl($scope) {
    $scope.controls = [
        {id: 1, isSel:null},
        {id: 2, isSel:null},
        {id: 3, isSel:null}
    ];
    $scope.colors = [
        {name:'black'},
        {name:'red'},
        {name:'yellow'}
    ];
}
于 2013-02-10T13:01:49.603 回答