Question

我想最初（在页面加载时）在md-select中设置当前的schoolclass项。

此代码设置选定的学校类，但不会在md-select视觉上反映出来。

$scope.selectedSchoolclass = schoolclasses.length > 0 ? schoolclasses[0] : null;

<md-input-container>
    <label>Schoolclasses</label>
    <md-select ng-model="selectedSchoolclass"  md-on-close="getPupils()">
        <md-option ng-repeat="s in schoolclasses" ng-value="{{s}}">
            {{s.schoolclassNumber}}
        </md-option>
    </md-select>
</md-input-container>

当我使用md-selected="$first"时，它会在md-select中直观地被选中，但我从计算属性中得到一个错误，它似乎首先在$ first之前进行评估。因此，我不能将第一个学校课程设置为html中选定的学校课程。我必须通过控制器中的JS来完成它。

我该怎么做？

Answer 1

你很亲密。只需改变

<md-option ng-repeat="s in schoolclasses" ng-value="{{s}}">

要

<md-option ng-repeat="s in schoolclasses" ng-value="s">

ng-value已经预期会有角度表达式see here），因此您无需使用{{}}来评估表达式。

编辑：

而且，我认为你的意思是：

$scope.selectedSchoolclass = $scope.schoolclasses.length > 0 ? $scope.schoolclasses[0] : null;

schoolclasses需要是$ scope.schoolclasses，因为你在模板中引用它。

Answer 2

您可能需要添加ng-model-options并在某些标识属性上指定trackBy - 可能是id，name或schoolclassNumber。

另外，请务必删除{{}}上的ng-value。

<md-select ng-model="selectedSchoolclass"  md-on-close="getPupils()" ng-model-options="{trackBy: '$value.schoolclassNumber'}">
    <md-option ng-repeat="s in schoolclasses" ng-value="s" ng-bind="s.schoolclassNumber"></md-option>
</md-select>

我也不确定在此处分配null是否有问题，也许可以尝试undefined。

在track by上指定ng-repeat也是一种好习惯。再次，使用您的识别属性。

<md-option ng-repeat="s in schoolclasses track by s.schoolclassNumber" ng-value="s" ng-bind="s.schoolclassNumber"></md-option>

Answer 3

只需像这样更改你的md-select

  <md-select ng-model="selectedSchoolclass"  md-on-close="getPupils()">
        <md-option ng-repeat="s in schoolclasses" ng-value="{{s}}">
            {{s.schoolclassNumber}} ng-selected="{{ selectedSchoolclass.indexOf(s.schoolclassNumber) > -1}}"
        </md-option>
    </md-select>

以编程方式更改md-select中的所选项目

3 个答案: