Angularjs 为什么Angular在默认情况下没有选择正确的选择选项？

我们有一个选择标记，如下所示：

<select id="nonemployeeSelect"
        ng-model="data.nonEmployeeCase.nonEmployeeId">
    <option ng-repeat="nonemployee in data.nonemployees"
            ng-value={{nonemployee.id}} ng-selected="{{nonemployee.id == @ViewBag.nonempId}}">
        {{nonemployee.organization.displayValue}}
    </option>
</select>

$scope.data.nonEmployeeCase = {};
$scope.data.nonEmployeeCase.nonEmployeeId = 1;

 <select id="nonemployeeSelect" ng-model="data.nonEmployeeCase.nonEmployeeId" class="ng-pristine ng-untouched ng-valid ng-not-empty">
        <!-- ngRepeat: nonemployee in data.nonemployees --><option ng-repeat="nonemployee in data.nonemployees" ng-value="1" ng-selected="false" class="ng-binding ng-scope" value="number:1" selected="selected">
            Office of the Administrator
        </option><!-- end ngRepeat: nonemployee in data.nonemployees --><option ng-repeat="nonemployee in data.nonemployees" ng-value="2" ng-selected="false" class="ng-binding ng-scope" value="number:2">
            Office of Women’s Health
        </option><!-- end ngRepeat: nonemployee in data.nonemployees --><option ng-repeat="nonemployee in data.nonemployees" ng-value="3" ng-selected="true" class="ng-binding ng-scope" value="number:3">
            Office of Budget
        </option><!-- end ngRepeat: nonemployee in data.nonemployees --><option ng-repeat="nonemployee in data.nonemployees" ng-value="4" ng-selected="false" class="ng-binding ng-scope" value="number:4">
            Office of the Administrator
        </option><!-- end ngRepeat: nonemployee in data.nonemployees --><option ng-repeat="nonemployee in data.nonemployees" ng-value="5" ng-selected="false" class="ng-binding ng-scope" value="number:5">
            Division of Budget Execution and Management
        </option><!-- end ngRepeat: nonemployee in data.nonemployees --><option ng-repeat="nonemployee in data.nonemployees" ng-value="6" ng-selected="false" class="ng-binding ng-scope" value="number:6">
            Division of Program Budget Services
        </option><!-- end ngRepeat: nonemployee in data.nonemployees -->
    </select>

ng repeat来自范围内的一组非雇员：

$scope.data.nonemployees

因此，select的html最终如下所示：

<select id="nonemployeeSelect"
        ng-model="data.nonEmployeeCase.nonEmployeeId">
    <option ng-repeat="nonemployee in data.nonemployees"
            ng-value={{nonemployee.id}} ng-selected="{{nonemployee.id == @ViewBag.nonempId}}">
        {{nonemployee.organization.displayValue}}
    </option>
</select>

$scope.data.nonEmployeeCase = {};
$scope.data.nonEmployeeCase.nonEmployeeId = 1;

 <select id="nonemployeeSelect" ng-model="data.nonEmployeeCase.nonEmployeeId" class="ng-pristine ng-untouched ng-valid ng-not-empty">
        <!-- ngRepeat: nonemployee in data.nonemployees --><option ng-repeat="nonemployee in data.nonemployees" ng-value="1" ng-selected="false" class="ng-binding ng-scope" value="number:1" selected="selected">
            Office of the Administrator
        </option><!-- end ngRepeat: nonemployee in data.nonemployees --><option ng-repeat="nonemployee in data.nonemployees" ng-value="2" ng-selected="false" class="ng-binding ng-scope" value="number:2">
            Office of Women’s Health
        </option><!-- end ngRepeat: nonemployee in data.nonemployees --><option ng-repeat="nonemployee in data.nonemployees" ng-value="3" ng-selected="true" class="ng-binding ng-scope" value="number:3">
            Office of Budget
        </option><!-- end ngRepeat: nonemployee in data.nonemployees --><option ng-repeat="nonemployee in data.nonemployees" ng-value="4" ng-selected="false" class="ng-binding ng-scope" value="number:4">
            Office of the Administrator
        </option><!-- end ngRepeat: nonemployee in data.nonemployees --><option ng-repeat="nonemployee in data.nonemployees" ng-value="5" ng-selected="false" class="ng-binding ng-scope" value="number:5">
            Division of Budget Execution and Management
        </option><!-- end ngRepeat: nonemployee in data.nonemployees --><option ng-repeat="nonemployee in data.nonemployees" ng-value="6" ng-selected="false" class="ng-binding ng-scope" value="number:6">
            Division of Program Budget Services
        </option><!-- end ngRepeat: nonemployee in data.nonemployees -->
    </select>

署长办公室
妇女健康办公室
预算办公室
署长办公室
预算执行和管理司
项目预算服务司

在上面的例子中，第三个选项是“ng selected==true”，因此我们的ng selected表达式工作正常

我们有来自非雇员的ng值。id给出了我们的ng值（1,2,3,4,5,6）。 我们将ng模型绑定到控制器中的“data.nonEmployeeCase.nonEmployeeId”。 如果更改“选择”选项，它将更新模型值。太好了

问题在于，ng值应该是工作的ng selected，以便在加载执行时立即选择正确的表达式并更新模型。但事实并非如此。它从“data.nonEmployeeCase.nonEmployeeId”中获取模型值，并使用该值将正确的选项设置为selected

这在其他地方对我有效，但在这里不起作用。 有人看到问题了吗？ 有什么想法吗

它似乎在反向运行。

---

模型正在初始化所选选项，而不是ng value和ng selected一起选择正确的选项标记，然后更新模型。之后，可以选择其他选项并更新模型。那太好了。但是我们需要以另一种方式初始化。

我不知道为什么这个方法不能像在其他地方那样对我有效。但是我用选项标签上的ng init修复了它

<select id="nonemployeeSelect" 
        ng-model="data.nonEmployeeCase.nonEmployeeId">
    <option ng-repeat="nonemployee in data.nonemployees"
            ng-init="nonemployee.id == @ViewBag.nonempId ? data.nonEmployeeCase.nonEmployeeId = nonemployee.id : null"
            ng-value={{nonemployee.id}}>
        {{nonemployee.organization.displayValue}}
    </option>
</select>

{{nonemployee.organization.displayValue}

文档警告说，

ng selected

不应与

select

指令和

ng model

指令一起使用

注意：

ngSelected

不与

select

和

ngModel

指令交互，它只设置元素上的

selected

属性。如果在选择上使用

ngModel

，则不应在选项上使用

ngSelected

，因为

ngModel

将设置选择值和所选选项

有关详细信息，请参阅

---

为什么不使用ng选项？有什么原因吗？或者只是你不知道？可能是