Question

我正在尝试使用“选择”ng-options功能选择团队的领导者。

学生对象：

student{
name:String,
status : String
}

我选择团队负责人的代码如下。

<select ng-model="class.team.leader" ng-options="student._id as student.name for student in curTeam.students">
    <option value="">Select leader</option>
    <option value="class.team.leader">{{class.team.leader.name}}</option>
</select>

'select'将值正确存储到适当的模型值中。但是，当我转到页面视图时，选择不会正确显示模型值。但是这段代码可以保存细节。

要求：

如果模型没有值，则选项值=“”==＆gt;默认情况下显示“选择领导者”。如果是，它应该显示'class.team.student.name'

有人请告诉我哪里出错了。感谢。

Answer 1

HTML：

<select ng-model="class.team.leader" ng-options="student._id as student.name for student in curTeam.students">
    <option ng-show="!weHaveALeader" value="">Select leader</option>
    <option ng-show="weHaveALeader" value="class.team.leader">{{class.team.leader.name}}</option>
</select>

JS：

$scope.weHaveALeader = false;
$scope.$watch('class.team.leader', function(new, old) {
    $scope.weHaveALeader = true
}

Answer 2

你可以删除第二个选项标签，这似乎是不必要的。

我已将您的代码放入了http://plnkr.co/edit/OZCal9ZkCQeqnQJY0WP9?p=preview，但它似乎工作正常。

<select ng-model="class.team.leader" ng-options="student._id as student.name for student in curTeam.students">
  <option value="">Select leader</option>
</select>
<div><b>Team Leader:</b> {{class.team.leader}}</div>

如果那不是你想要的，请详细说明遗漏的内容。

Answer 3

使用选择ng-model的正确方法如下。

选择领导者 {{class.team.leader.name}}

这解决了在页面重新加载时显示的问题。

在角度js中选择ng-options问题

3 个答案: