有条件地在Angular中填充选择列表

debugcn 发表于 Dev

萨德加巴扬

我有一个选择列表，应该有条件地填写。

这是条件：
获取数据的函数

function getDocumentTypeList() {

         BaseInfoService.getDocumentTypeList().then(function (data) {
             $scope.documentTypeList = data;
             $scope.requestAuthorization.DocumentType = 0
             $scope.conditionalLabel();
             debugger;
         });

     }
////////////////////////////
     function getSpecialList() {

         BaseInfoService.getSpecialList().then(function (data) {
             $scope.specialList = data;
             debugger;
         });

     }

有一个选择列表定义应该显示哪一个。

如果value === 1 ng-option填充，people
如果value === 2 ng-option填充，从person
[Fiddle] 1

谢谢

吉米·钱德拉（Jimmy Chandra）

假设：两个列表的形状相似。

您可以将范围函数用作源，并在该函数中执行if或switch语句以找出要使用的源。

像这样的东西：

(function() {
  'use strict';
  
  angular.module('myApp', []);
  
  angular.module('myApp')
    .controller('myCtrl', myCtrl);
  
  myCtrl.$inject = ['$log'];
  function myCtrl($log) {
    var self = this;
    
    var ducks = [
      { name: 'Donald' },
      { name: 'Daisy' }
    ];
    
    var mice = [
      { name: 'Mickey' },
      { name: 'Minnie' }
    ];
    
    self.listType = 2;  //change to 1 for ducks, 2 or anything else for mice
    self.selectedThing = null;
    
    self.getListOptions = function() {
      switch(self.listType) {
          case '1': return ducks;
          case '2': 
          default:
            return mice;
      }
    }
  }
}());

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl as vm">
  
  <label for="radType1"><input type="radio" name="radType" id="radType1" ng-model="vm.listType" value="1">Ducks</label>
  <label for="radType2"><input type="radio" name="radType" id="radType2" ng-model="vm.listType" value="2">Mice</label>
  
  <br>
  <select ng-options="o.name for o in vm.getListOptions()" ng-model="vm.selectedThing">
  </select>
</div>

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。