AngularJS | ng-options指令

AngularJS中的ng-options指令用于构建带有选项的HTML元素并将其绑定到模型属性。它用于在<选择>列表中指定<选项>。它是专门为填充下拉列表中的项目而设计的。 元素支持它。

句法：

 Content ...  

示例1：本示例使用ng-options指令显示option元素。

  

    ng-options Directive
      
    
    

  

      
    GeeksforGeeks
    ng-options Directive                             
      
    
        Sorting Algorithms: 
        
          
        
          
        Selected sorting algorithm: 
        
    
      
    
        var app = angular.module("app", []);
        app.controller('geek', ['$scope', function ($scope) {
            $scope.sorting = [
                { name: 'Merge sort', id: 1 }, 
                { name: 'Quick sort', id: 2 }, 
                { name: 'Bubble sort', id: 3 }
            ];
        }]);
    

  
                    

输出：
选择元素之前：

选择元素后：

示例2：本示例使用ng-options伪指令隐藏或显示元素。

  

    ng-options Directive
      
    
    

  

      
    GeeksforGeeks
    ng-options Directive                               
      
    
        Choose: 
      
        
          
         
            Check to hide 
        
    
      
    
        var app = angular.module("app", []);
        app.controller('geek', ['$scope', function ($scope) {
            $scope.HideShow = [
                { name: 'Hide', hide: true, }, 
                { name: 'Show', hide: false }
            ];
        }]);
    

  

输出：
选择隐藏元素之前：

选择hide元素后：