angularjs - md-chips 当 readonly='true' 时，仍然需要有一个占位符

Question

我的 md-chips 模板为：

<md-chips dropdown ng-model="chipArray" readonly="true" 
 md-on-remove="blah($chip)" ng-click="blahBlah()" placeholder="Add an item"> 
       <md-chip-template><span>{{$chip.name}}</span>
</md-chip-template> </md-chips>

在我的情况下，md-chips 是一个下拉列表，我在下拉列表中进行了搜索。由于 readonly=true，占位符不会被显示。

如果我删除只读属性，占位符很好，但我觉得在我的情况下，我们仍然需要一个占位符。或者替代方案会很好。我尝试了容器提示，我不确定这里是否正确，但它似乎不起作用。

https://codepen.io/anon/pen/bWpaoB

第一个例子是非只读的，第二个例子是只读的

Answer 1

您需要将 HTML 替换为以下代码：

<md-chips placeholder="Add an item" readonly="false" md-removable="false" ng-model="ctrl.contacts2"></md-chips>

该属性md-removable="false"允许在您的组件中维护您的占位符，但这会禁用删除您的项目的可能性。

继续摇摆！