Question

我有一个像这样的选择框：

    <select class="form-control"
            ng-model="contactName"
            ng-change="testFun(contactName)"
            ng-options="contact.Id as contact.Name + ' ' + contact.Surname for contact in company.items.contacts"
            ng-selected="$scope.contactId === contact.Id">
    </select>

其中$ scope.contactId = 14151且contact.Id = 14151

但是选择框仍然没有选择合适的人，但仍然显示空白。

我无法弄清楚我在这里做错了什么。

修改

<select class="form-control" 
        ng-model="contactName"
        ng-change="testFun(contactName)"
        ng-options="contact.Id as contact.Name + ' ' + contact.Surname + ' id:' + contact.Id for contact in company.items.contacts"
        ng-selected="contactId == contact.Id">
 </select>
 <pre>
    contactId: {{contactId}}
 </pre>

结果如下，这也证实了ID是相同的： ContactId Option with the same ID

该框仍然空白

Answer 1

来自AngularJS docs：

注意：ngSelected不与select和ngModel指令交互，它只在元素上设置selected属性。如果在select上使用ngModel，则不应在选项上使用ngSelected，因为ngModel将设置选择值和选定选项。

话虽如此，您应该使用ng-init="contactName = contactId"作为@Noman建议，使用contactName初始化contactId变量，随后选择正确的选项。

Answer 2

使用ng-init这将有效。你不能在html中使用$scope。删除$scope会有效。

<select class="form-control"
        ng-model="contactName"
        ng-change="testFun(contactName)"
        ng-options="contact.Id as contact.Name + ' ' + contact.Surname for contact in company.items.contacts"
        ng-init="contactName = contactId" >
</select>

ngSelected不适用于ngOptions，您必须使用ng-init。

：AngularJS：ng-selected不使用true语句

2 个答案: