Angularjs 如何禁用角材料组件md芯片？

我已经阅读了angular material文档，它们具有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>

密件抄送


电子邮件必须包含a-z、a-z、0-9或u字符

我在中复制了您的代码，对我来说，它工作得很好

<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'];
   }
]);

只读
不只读
var myApp=angular.module（'myApp'，['ngMaterial']）；
控制器（“MyCtrl”、[“$scope”、“$rootScope”、函数（$scope、$rootScope）{
$scope.bcc=[‘西兰花’、‘卷心菜’、‘胡萝卜’]；
}
]);

检查您的角度材质和角度版本

我在中复制了您的代码，对我来说，它工作得很好

<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'];
   }
]);

只读
不只读
var myApp=angular.module（'myApp'，['ngMaterial']）；
控制器（“MyCtrl”、[“$scope”、“$rootScope”、函数（$scope、$rootScope）{
$scope.bcc=[‘西兰花’、‘卷心菜’、‘胡萝卜’]；
}
]);

---

检查您的角度材质和角度版本

如果您有ng模型，angular material将始终将其视为可编辑。此外，在文档中，如果没有提供ng模型，芯片将自动标记为只读

所以这里是修复

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

{{chip}}

如果您有ng模型，angular material将始终将其视为可编辑。此外，文档中还指出，如果没有提供ng模型，芯片将自动标记为只读

所以这里是修复

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

{{chip}}

我们还有其他方法可以完成这项任务吗？@hussain不是真的，md chips只有readonly属性。我们还有其他方法可以完成这项任务吗？@hussain不是真的，md chips只有readonly属性。你有JS错误吗？当我在我的应用程序中尝试这一点时，我遇到了一个异常，文本为：“只能有一个或子元素！”您是否收到JS错误？当我在我的应用程序中尝试这一点时，我得到了一个例外：“只能有一个或子元素！”