如何在新生產線上拆分材料芯片？

Question

在按下輸入時，我需要分割下一行的每個項目。 Material Chips。任何關於如何開始的指針。

我從textarea開始，開始編寫自定義CSS來實現它。但UI並不像Material那麼棒。

Answer 1

您可以通過md-chips指令添加自定義css類。之後，將css規則添加到樣式md-chip子元素。

CHECK THIS PLUNKER WITH 3 DIFFERENT EXAMPLES

HTML：

<md-chips class="chip-new-line" ng-model="data" placeholder="Enter an animal"></md-chips> 

CSS

.chip-new-line md-chip { 
    display: block; 
    clear: left; 
    float: left; 
} 

可選：如果你想每個芯片取100％的容器，只需用下面的css代替：

.chip-new-line md-chip { 
    display: block; 
    width: 100%; 
}