如何在线使用md-chips

Question

我正在尝试在单行中使用角度材料的 md-chips 指令，但是当我添加的芯片多于字段大小时，该字段会在底部添加一行，就像 image 一样。

Answer 1

我认为您需要一种 CSS 解决方法来适应输入表单中 md-chips 的行为。

例如，您可以使用以下 CSS：

/* reduce input element (not visible till the user begins editing) width */
.md-chips .md-chip-input-container input {
  max-width: 20px;
}

 /* adapt input to md-chip height */
.myheight {
  height: 49px !important;
}

/* adapt datepicker input to md-chip height */
.md-datepicker-input {
  height: 49px;
}

这是一个演示：http://codepen.io/beaver71/pen/gPqPBW

P.S.：不要忘记文档声明：

警告：此组件正在进行中。如果您现在使用它，它可能会在您的未来打破。