Question

我在ng-repeat中迭代的每个对象都有一个或多个选择框。用户应该能够从选择框中选择3个优先级，并通过单击按钮进行保存。在保存功能中，我想访问object.id选择框属于选择的值。

以下是我目前的代码，其中包含我的问题和评论中的问题：

HTML

<div ng-repeat="object in objects">
    <div>
        <md-input-container>
            <md-select ng-model="selectedPriority" placeholder="Priorität">
                <md-option ng-value="{{ priority.name }}+{{ object.id }}" ng-repeat="priority in priorities">{{ priority.name }}</md-option> <!--setting of ng-value throws an error? How can I do this?-->
            </md-select>
        </md-input-container><br>
        {{ object.id}}
    </div>
</div>
<md-button ng-click="save()">Save</md-button>

控制器

$scope.save = function () {
    console.log($scope.selectedPriority); //Here I want to get all object.id with selected value but it is undefined
}

@Sajeetharan：对象json具有以下形式

JSON

[{  
    "date":"2017-01-21T18:20:00.873Z",
    "duration":120,
    "location":"Test",
    "passed":false,
    "id":"58838763019ac0479455bbc0"
},
{  
    "date":"2017-01-21T15:15:00.420Z",
    "duration":10,
    "location":"Test",
    "passed":false,
    "id":"58839ac9019ac0479455bbc1"
}
//...]

Answer 1

你不能这样使用：ng-value="{{ priority.name }}+{{ object.id }}"

您必须将它们分开：ng-model="object.selectedPriority"和ng-value="priority"。最后在保存按钮上单击：make循环打印每个对象的所选优先级。

我假设你的priorities数组是一堆带有name个键的对象。检查一下：http://codepen.io/anon/pen/pRPbdq

抱歉，如果我错了：）

Answer 2

幸运的是，您可以将数组传递给ng-model指令，但这里的技巧是使用适当的索引。

您需要按如下方式更改HTML：

<div ng-repeat="object in objects track by $index">
  <div>
    <select ng-model="selectedPriority[$index]">
      <option ng-repeat="priority in priorities" value="{{ priority.name }}+{{ object.id }}">{{priority}}</option>
    </select>
  </div>
</div>

在这里，我们使用范围变量selectedPriority，它被声明为数组。

现在，如果您只是在按钮的单击上控制$scope.selectedPriority，您将获得一个包含所需值的数组。

Answer 3

请试试这个：

将selectedPriority初始化为空数组：

$scope.selectedPriority = [ ];

使用ng-change将更改反映到selectedPriority，仅用于在保存功能中访问它们。

<div ng-repeat="object in objects">
    <div>
        <md-input-container>

            <md-select ng-model="selectedPriority[$index].priority" placeholder="Priorität" ng-change=" selectedPriority[$index].objectId = object.id">
                <md-option ng-value="priority.name" ng-repeat="priority in priorities">{{ priority.name }}</md-option> <!--setting of ng-value throws an error? How can I do this?-->
            </md-select>
        </md-input-container><br>
        {{ object.id}}
    </div>
</div>
<md-button ng-click="save()">Save</md-button>

然后访问selectedPriority：

$scope.save = function(){
    // use $scope.selectedPriority[neededIndex].objectId ;
    // use $scope.selectedPriority[neededIndex].priority ;
}

使用id保存多个选择框的值

3 个答案: