Question

我有以下HTML列表：

<input ng-model="searchValue" />
[...]
<ul>
  <li ng-repeat="item in dataset" ng-if="item.contains(searchValue)">{[item.name]}</li>
  <li noresult>No result ...</li>
</ul>

我更喜欢使用ng-if而不是ng-repeat过滤器。

而且我想管理这些商品＆＃39;使用以下指令显示：

directive('noresult', [
    function () {return {
        restrict: "A",
        link : function (scope, element, attrs) {
          scope.$watch(
            function () { return element.parent().children().length; },
            function (length) {
                console.log(length)
                if(length == 1){element.show();}
                else{element.hide();}
            }
          );
        } 
}}]);

当我在输入中键入内容时，＆＃34; console.log＆＃34;提出每两个字母！

为什么？我该如何解决？

Answer 1

我可以在不使用指令的情况下建议以下内容吗？

<input ng-model="searchValue" />

<ul>
  <li ng-repeat="item in filteredSet = (dataset | filter:searchValue)" ng-if="showItem(item, searchValue)">{{item}}</li>
  <li  ng-if="filteredSet.length == 0">No result ...</li>
</ul>

在控制器中添加一个功能：

$scope.showItem = function(item, searchVal) {
    return !searchVal || item.indexOf(searchVal) > -1;
}

Fiddle

Answer 2

我终于找到了，将其添加到控制器：

$scope.$watch('searchValue', function(){
    $timeout(function(){
        $scope.$apply();
}),1});

但它的临时工作...... 我明白我想要做的是 而不是AngularJS Way 。

但是，过滤器的算法必须在对象中，而不仅仅是在任何地方。
它 对象方式 ！

AngularJS - $ watch <ul>儿童长度问题</ul>

2 个答案: