angular-material - md-chips 和 md-autocomplete 输入字段

Question

当用户使用 md-chips 输入输入并移除焦点时，该条目仍然存在。一旦焦点被移除，有没有办法删除任何不是芯片的条目？ 移除焦点后仍会显示突出文本

Answer 1

通常，您应该可以通过使用来做到这一点，ng-blur但由于某种原因，该指令在使用中存在问题md-autocomplete：https ://github.com/angular/material/issues/3906

但我试图以不同的方式解决它，不是最正确的方法，但它确实有效。您要做的就是将事件与blurin inputinside绑定md-autocomplete。在这种情况下，您必须清除 md-autocomplete 的 searchText。因此，只需以某种方式将该事件绑定到您的控制器中：

angular.element(document.querySelector('md-autocomplete input')).bind('blur', 
    function(){ 
        setTimeout(function(){
            angular.element(document.querySelector('md-autocomplete')).scope().ctrl.searchText = ''; 
            angular.element(document.querySelector('md-autocomplete')).scope().$apply();
        }, 300);
    }
)

我使用 timeout 的原因是如果 searchText 变量被清除得太快，则没有添加芯片。但是当我添加 300 毫秒延迟时，它按我的预期工作。当然有更好的方法可以做到这一点，但只要尝试这样做，也许对你来说就足够了。

这是工作的codepen：http ://codepen.io/anon/pen/QdNydx