在这个 plunkr 中,为什么 ng-model 不更新?

In this plunkr, why doesn't the ng-model update?

我分叉了一个 ui-select plunkr 并根据我自己的情况进行了调整。 ng-model 不会更新,但单击按钮更新模型会更新 ui-select.

提前致谢!

  <h3>Select2 theme</h3>
  <p>Selected: {{id}}</p>
  <ui-select ng-model="id" theme="select2" style="min-width: 300px;">
    <ui-select-match placeholder="Select a person in the list or search his name/age...">{{$select.selected.email}}</ui-select-match>
    <ui-select-choices repeat="person.id as person in people.devs | propsFilter: {email: $select.search, id: $select.search}">
      <div ng-bind-html="person.id | highlight: $select.search"></div>
      <small>
        <span ng-bind-html="''+person.id | highlight: $select.search"></span>
        {{person.email}}
      </small>
    </ui-select-choices>
  </ui-select>

  <br>
  <br>
  <br>
  <button class="btn btn-primary"ng-click="id = 2">Change Model</button>
  <span>(id = 2) </span>

http://plnkr.co/edit/3vEXkkNLvuNhpO1hKpmj?p=previewenter link description here

范围问题:

 <ui-select ng-model="$parent.id" ....>

为了永远不会出现这个问题,请使用点符号并在控制器中初始化变量:表示中间字段。

 // controller
 $scope.context = {id:-1};
 // html
  <ui-select ng-model="context.id"

这种情况经常发生,ng-if 会引发同样的问题。这是由于 javascript 继承的限制。 Angular没办法。