CODEWITHSUNDEEP
angularjsangular-material
Jackie
Jackie

Reputation: 23637

Can I filter promise when using Angular Material Autocomplete (md-autocomplete)

I have the following in my autocomplete

md-autocomplete(flex-gt-sm="50"
                placeholder="Select label or enter new label",
                md-selected-item="ctrl.node.label",
                md-items="item in ctrl.getLabels() | filter:ctrl.labelSearchText",
                md-item-text="item",
                md-search-text="ctrl.labelSearchText",
                md-floating-label="Label")
  md-item-template
    span {{item}}

With the following as getLabels

this.getLabels = function() {
  return Restangular.all('label').getList();
};

When I run this code it does not filter the results instead I get the entire list. Is there a way to filter these results?

Upvotes: 1

Views: 902

Answers (1)

kuhnroyal
kuhnroyal

Reputation: 7563

I am not sure if you can filter with angular filters in the tag itself. But you can do this with lodash.filter or angular filters in the javascript function.

md-autocomplete(flex-gt-sm="50"
                placeholder="Select label or enter new label",
                md-selected-item="ctrl.node.label",
                md-items="item in ctrl.getLabels(ctrl.labelSearchText)",
                md-item-text="item",
                md-search-text="ctrl.labelSearchText",
                md-floating-label="Label")
  md-item-template
    span {{item}}

And the getLabels function.

this.getLabels = function(searchText) {
    return this.$q(function (resolve) {
        Restangular.all('label').getList().then(function (result) {
             resolve(_.filter(result.data, function(label) {
                 // filter here, simple case string equality
                 return label === searchText;
             }));
        });
    });
};

Upvotes: 1

Related Questions