如何在新生产线上拆分材料芯片？

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%; 
}