Question

选中时，我的ngModel myOpt2不会更改，如果有效，则为myOpt。它为什么没有变化？

使用ngModel myOpt2不能选择myOpt si功能。 Alguna razon por la que no cambia？

sentinel.conf

var app = angular.module('App_Alta', []);

app.controller('Ctrl_Categorias', function ($scope, $http) {

    $scope.lstCatalogos = [{ sNombre: "Vehículos", iID: 1, iIdPadre: 0, bUltimo: false }]
    $scope.lstSubCategorias = []


    $scope.$watch("myOpt", function (newval, oldval) {
        if (newval == undefined || newval.iID == 0) {
            return false;
        }
        $scope.lstSubCategorias[0] = [{ sNombre: "Autos", iID: 17, iIdPadre: 1, bUltimo: true }]
    });

});

没有坎比亚？

Answer 1

在设置 myOpt2

之前，请尝试检查 myOpt 是否确实更改过

$scope.$watch("myOpt", function (newval, oldval) {
  if(newval !== oldval) {
    if (newval == undefined || newval.iID == 0) {
        return false;
    }
    // I'm assuming this is where you are trying to make myOpt2 selected based on first select
    $scope.myOpt2 = [{ sNombre: "Autos", iID: 17, iIdPadre: 1, bUltimo: true }]
  }
});

Answer 2

他对他的情有独钟。 Declarando myOpt2完全不可用，请选择Option declarando ngModel =“ myOpt2 [$ index]”

var app = angular.module('App_Alta', []);

app.controller('Ctrl_Categorias', function ($scope, $http) {

    $scope.lstCatalogos = [{ sNombre: "Vehículos", iID: 1, iIdPadre: 0, bUltimo: false }]
    $scope.lstSubCategorias = [];
    $scope.myOpt2 = [];

    $scope.$watch("myOpt", function (newval, oldval) {
        if (newval == undefined || newval.iID == 0) {
            return false;
        }
        $scope.lstSubCategorias[0] = [{ sNombre: "Autos", iID: 17, iIdPadre: 1, bUltimo: true }]
    });

});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="example-wrap" ng-app="App_Alta" ng-controller="Ctrl_Categorias" id="AppAngular1">
  <div>
      <header Class="example-title">
          Seleccione una categoria
      </header>
      <div class="example">
          <select class="form-control"
                  ng-model="myOpt"
                  selectpicker="{ noneSelectedText: 'Seleccione una opción' }"
                  select-model="lstCatalogos"
                  ng-options="x.sNombre for x in lstCatalogos"></select>
      </div>
      <div class="example" ng-repeat="l in lstSubCategorias">
          <select class="form-control"
                  ng-model="myOpt2[$index]"
                  selectpicker="{ noneSelectedText: 'Seleccione una opción' }"
                  select-model="lstSubCategorias"
                  ng-options="x.sNombre for x in l"></select>
      </div>
  </div>
<p>{{myOpt}}</p>
<p>{{myOpt2[0]}}</p>
</div>

Answer 3

如果有观察者，则可以使用ng-change directive来简化代码。

var app = angular.module('App_Alta', []);

app.controller('Ctrl_Categorias', function ($scope, $http) {

    $scope.lstCatalogos = [{ sNombre: "Vehículos", iID: 1, iIdPadre: 0, bUltimo: false }]
    $scope.lstSubCategorias = [];
    $scope.myOpt2 = [];

    //$scope.$watch("myOpt", function (newval, oldval) {
    $scope.myOptChange = (function(newval) { 
        if (newval == undefined || newval.iID == 0) {
            return false;
        }
        $scope.lstSubCategorias[0] = [{ sNombre: "Autos", iID: 17, iIdPadre: 1, bUltimo: true }]
    });

});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div class="example-wrap" ng-app="App_Alta" ng-controller="Ctrl_Categorias" id="AppAngular1">
  <div>
      <header Class="example-title">
          Seleccione una categoria
      </header>
      <div class="example">
          <!-- USE ng-change directive -->
          <select class="form-control"
                  ng-model="myOpt"
                  ng-change="myOptChange(myOpt)"
                  ng-options="x.sNombre for x in lstCatalogos">
          </select>
      </div>
      <div class="example" ng-repeat="l in lstSubCategorias">
          <select class="form-control"
                  ng-model="myOpt2[$index]"
                  ng-options="x.sNombre for x in l">
          </select>
      </div>
  </div>
<p>{{myOpt}}</p>
<p>{{myOpt2[0]}}</p>
</div>

使用ng-change指令可提高性能，因为仅当选择更改时才调用该函数，而不是在每个摘要周期中进行脏检查。此外，由于Angular 2+还没有$scope.$watch方法，这使得将来向Angular 2+的迁移更加容易。

有关更多信息，请参见

div中使用ng-repeat选择的选项不会更改ng-model

3 个答案: