角度材料のmdチップを無効にするにはどうすればいいですか？

Question

私は角材料のドキュメントを読んでおり、要素を無効にするreadonly属性があります。しかし、私はそれを動作させることができません、私は使用できる他の角度材料のアプローチはありますか？私はデフォルトで要素を無効にしたい。 main.htmlを

<div layout="row" layout-margin> 
    <md-input-container flex="100" class="notifyUser-chips"> 
     <label>Bcc</label> 
     <br> 
     <md-chips flex="100" 
       ng-model="notifyCtrl.bcc" 
       name="email" 
       readonly="true"> 
     </md-chips> 
     <p style="color:red" ng-show="patternError">An email must contain a-z, A-Z, 0-9, or _ characters</p> 
    </md-input-container> 
</div> 

Answer 1

は、私は私のためにそれがうまく働いて、this fiddleにあなたのコードを複製し。

<div ng-app="myApp"> 
    <div ng-controller="MyCtrl"> 
    <div layout="column" layout-margin> 
     Readonly 
     <md-chips ng-model="bcc" 
        name="email" 
        readonly="true"> 
     </md-chips> 

     Not readonly 
     <md-chips ng-model="bcc" 
        name="email"> 
     </md-chips> 
    </div> 
    </div> 
</div> 

var myApp = angular.module('myApp',['ngMaterial']); 

myApp.controller("MyCtrl", ["$scope","$rootScope", function($scope,$rootScope){ 
     $scope.bcc = ['Broccoli','Cabbage','Carrot']; 
    } 
]); 

角物質と角バージョンを確認してください。

Answer 2

もしあなたがngモデルを持っていれば、角度材料はそれらを編集可能として扱います。また、ngモデルが提供されていなければ、チップは自動的に読み取り専用としてhttps://material.angularjs.org/latest/api/directive/mdChipsとマークされます。だからここ

が修正です...

<md-chips flex="100"> 
    <md-chip ng-repeat="chip in notifyCtrl.bcc" 
      name="email" 
      readonly="true">{{chip}} 
    </md-chip> 
</md-chips>