动态添加 Angular Material mdAutocomplete

Question

我有一个很长的颜色列表，我想创建一个 table 用于颜色选择。但是当我用 ng-repeat 重复我的 table 行时，所有 mdAutocompletes 运行 在一起并且没有工作。这是我试过的：codepen.io/anon/pen/avoMbg

我该如何解决这个问题？

Answer 1

您在 md-autocomplete 中对 md-selected-item 和 md-search-text 使用相同的变量。您忘记使用 sc 而不是 ctrl。

http://codepen.io/anon/pen/avoMbg

Answer 2

在您的 HTML 文件中进行以下更改：

HTML:

<md-autocomplete style="margin-bottom:10px;"
    md-selected-item="sc.selectedItem"
    md-search-text="sc.searchText"
    md-items="item in sc.querySearch(sc.searchText)"
    md-item-text="item.display"
    md-min-length="0"
    placeholder="Pick a color">
      <md-item-template>
         <span md-highlight-text="sc.searchText" md-highlight-flags="^i">{{item.display}}</span>
      </md-item-template>
</md-autocomplete>

在你的控制器中：

JS:

for(var i=0;i<self.colors.length;i++){
    self.colors[i].querySearch=querySearch;
}