2017-04-18 7 views
1

md-selectを無効にする必要がありますが、Angularのドキュメントで見つけることはできません。md-selectを無効にする方法

これは私のコードです:

<md-select ng-model="idSelectedMonth" placeholder="Month"> 
    <md-option ng-repeat="month in months" ng-value="month.number"> 
     {{month.number}} 
    </md-option> 
</md-select> 

答えて

4

あなたは=あなたはNG-無効になってチェックすることが

(function() { 
 
    'use strict'; 
 
    var app = angular.module("App",["ngMaterial"]); 
 

 

 
    
 
    app.controller("ctrl", [function() { 
 
     /* jshint validthis: true */ 
 
     var vm = this; 
 

 
     vm.title = "Hello World !"; 
 
     
 
     vm.items = [ 
 
      {id:-1, text:"No Selection"}, 
 
      {id:1, text:"Item 1"}, 
 
      {id:2, text:"Item 2"}, 
 
      {id:3, text:"Item 3"}, 
 
      {id:4, text:"Item 4"}, 
 
      
 
      ]; 
 
     
 
     return vm; 
 
    }]); 
 
    
 
    
 
})();
<!DOCTYPE html> 
 
<html ng-app="App"> 
 

 

 
<head> 
 
    <link rel="stylesheet" href="style.css" /> 
 
    <link rel="stylesheet" href="https://gitcdn.xyz/repo/angular/bower-material/master/angular-material.css" /> 
 

 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.7/angular.js"></script> 
 

 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.7/angular-animate.js"></script> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.7/angular-aria.js"></script> 
 

 
    <script src="https://gitcdn.xyz/repo/angular/bower-material/master/angular-material.js"></script> 
 

 

 
    <script src="app.js"></script> 
 
</head> 
 

 
<body> 
 
    <div ng-controller="ctrl as vm"> 
 
    <h1>{{vm.title}}</h1> 
 
    <md-input-container> 
 
     <label>Please choose</label> 
 
     <md-select flex ng-model="vm.selected" ng-disabled="true"> 
 
     <md-option ng-value="item" ng-repeat="item in vm.items"> 
 
      <span ng-show="item.id>0"> {{item.text}}</span> 
 
      <span ng-show="item.id<0" class="highlight"> {{item.text}}</span> 
 
      </md-option> 
 
     </md-select> 
 
    </md-input-container> 
 
    </div> 
 
    
 
    
 
</body> 
 

 
</html>

の下のようにMD-selectタグにng-disabled="true"を使用することができます"true"と "false"

3

ng-disabledは問題なく動作しています。それを示すのはJSFiddleです。

<md-select ng-model="idSelectedMonth" placeholder="Month"> 
    <md-option ng-repeat="month in months" ng-value="month.number" ng-disabled="true"> 
     {{month.number}} 
    </md-option> 
</md-select> 
関連する問題