2015-07-11 128 views
0

我在自定義過濾器時遇到了一些問題。我無法將其包含在我的項目中。首先我使用了一個過濾器:文本。我明白這個數組是異步初始化的並且使用了這個自定義過濾器。但是,當我包括這個過濾器,我有問題($注射器:unpr)。對不起我的英語不好。Angular的自定義過濾器

<div ng-controller="ProductList as products"> 
     <form ng-submit="addProduct()"> 
     <input type="text" placeholder="Enter product" ng-model="productTitle"> 
     <button>Add</button> 
     </form> 
     <ul class="productList"> 
     <li ng-repeat="product in list track by $index | custom:search"> 
      {{product.title}}  
     </li> 
     </ul> 
     <input type="text" placeholder="Search" ng-model="search"> 
</div> 

應用程序是在這裏

angular.module('lists', []) 
    .controller('ProductList', function($scope) { 
    $scope.list = []; 
    $scope.addProduct = function() { 
     $scope.list.push({title:$scope.productTitle}); 
     $scope.productTitle = ""; 
    } 
    }); 

和過濾是

.filter('custom', function() { 
    return function(input, search) { 
    if (!input) return input; 
    if (!search) return input; 
    var expected = ('' + search).toLowerCase(); 
    var result = {}; 
    angular.forEach(input, function(value, key) { 
     var actual = ('' + value).toLowerCase(); 
     if (actual.indexOf(expected) !== -1) { 
     result[key] = value; 
     } 
    }); 
    return result; 
    } 
}); 
+0

可以提供代碼的jsfiddle或plunker?嘗試使用未縮小的角度版本,併發布完整消息'我有問題($ injector:unpr)' – Grundy

+0

請參閱此示例(https://docs.angularjs.org/tutorial/step_09)。請注意,過濾器是使用稍後傳遞到主模塊的新模塊定義的。你錯過了那部分。 –

+1

@EricMartinez,我們不知道在哪裏定義過濾器,可能它實際上定義在同一個模塊 – Grundy

回答

0

我檢查了代碼和問題似乎正在應用的過濾器的地方。
小提琴:http://jsfiddle.net/pfgkna8k/2/。雖然我不知道你到底在做什麼。

<div ng-app="lists"> 
    <div ng-controller="ProductList as products"> 
      <form ng-submit="addProduct()"> 
       <input type="text" placeholder="Enter product" ng-model="productTitle" /> 
      <button>Add</button> 
      </form> 
      <ul class="productList"> 
      <li ng-repeat="product in list track by $index" ng-bind="filteredtitle = (product.title | custom: searchBox)" ng-show="filteredtitle"> 

      </li> 
      </ul> 
     <input type="text" placeholder="Search" ng-model="searchBox" /> 
    </div> 
</div> 
+0

中,我需要這個:當我在中搜索一些值時,只顯示那些產品。你的代碼是不正確的worc。 –

+0

這樣 - http://angular.github.io/angular-phonecat/step-9/app/#/phones –

+0

這是你執行的代碼。我只是讓過濾器部分工作,因爲這是問題中提到的事情。 – Ayush