在md-autocomplete中搜索时如何更改选项

时间:2017-12-09 15:50:28

标签: angularjs angularjs-directive angularjs-ng-repeat md-autocomplete

我在输入时如何更改选项。当我输入过滤器不能正常工作时,它无法正常工作所有列表我想根据搜索更改列表文本请帮帮我。

<md-autocomplete
    ng-disabled="Ctrlmain.isDisabled"
    md-no-cache="Ctrlmain.noCache"
    md-selected-item="Ctrlmain.selectedItem"
    md-search-text="Ctrlmain.campaignname"
    md-selected-item-change="Ctrlmain.filltextbox(item)"
    md-items="item in Ctrlmain.getMatches(Ctrlmain.campaignname)  | unique:'campaign_name'"
    md-item-text="item.campaign_name"
    md-min-length="0"
    placeholder="Pick an Angular repository"
    md-menu-class="autocomplete-custom-template">
        <md-item-template>
            <span class="item-title">                                
                <span> {{item.campaign_name}} </span>
            </span>
        </md-item-template>
</md-autocomplete>

角度方法

complete(str){

    var output = [];
    angular.forEach(this.viewData,function(campaignname){
      if(campaignname.campaign_name.toLowerCase().indexOf(str.toLowerCase())>=0){
        output.push(campaignname.campaign_name);

      };
    });
  return output.campaign_name;
}

filltextbox(st){   
   return st;
}

enter image description here

1 个答案:

答案 0 :(得分:1)

md-search-text-change上的返回匹配不起作用。您的md-autocomplete绑定到Ctrlmian.viewData。如果要工作,则必须在complete函数末尾修改所述数组。当你尝试返回output.campaign_name时,你的代码本质上是错误的,其中output是一个数组。或者你可以这样试试......

<md-autocomplete
    ng-disabled="Ctrlmain.isDisabled"
    md-no-cache="Ctrlmain.noCache"
    md-selected-item="Ctrlmain.selectedItem"
    md-search-text="Ctrlmain.campaignname"
    md-selected-item-change="Ctrlmain.filltextbox(item)"
    md-items="item in Ctrlmain.getMatches(Ctrlmain.campaignname)  | unique:'campaign_name'"
    md-item-text="item.campaign_name"
    md-min-length="0"
    placeholder="Pick an Angular repository"
    md-menu-class="autocomplete-custom-template">
        <md-item-template>
            <span class="item-title">                                
                <span> {{item.campaign_name}} </span>
            </span>
        </md-item-template>
</md-autocomplete>

注意我已经摆脱了md-search-text-change。我使用您的过滤功能动态呈现md-autocomplete的项目,如下所示。

getMatches(str) {
    var output = [];
    angular.forEach(this.viewData,function(campaignname) {
        if(campaignname.campaign_name.toLowerCase().indexOf(str.toLowerCase())>=0) {
            output.push(campaignname);
        };
    });
    return output;
}