Angularjs 角度型前置过滤器错误“；“未定义”不是一个函数；

我这里有一个可用的plunkr:，它定义并使用一个过滤器，将一个项目附加到建议的typeahead列表中。当我尝试合并到我的项目中时，它会在过滤器周围抛出一个错误。这是我的密码：

html:

脚本：

var app = angular.module('clientApp')
app.controller('TypeaheadCtrl', function ($scope, $http, StateService) {
    $scope.getProductSuggestions = function(val) {
        return $http.get(StateService.getServerAddress() + "search/autocomplete?q=" + val
            ).then(function(response){
            return response.data.products;
        });
    };
  })

app.filter('finalAppend', function($sce){
      return function(array, value){
        array.push(  // error: undefined is not a function!
            $sce.trustAsHtml('Look for <b>' + value + '</b> in other shops')
        ); 
        return array;
      }
})

var-app=angular.module（'clientApp'））
app.controller（'TypeaheadCtrl'，函数（$scope，$http，StateService）{
$scope.getProductSuggestions=函数（val）{
返回$http.get（StateService.getServerAddress（）+“search/autocomplete？q=“+val
).然后（功能（响应）{
返回响应.数据.产品；
});
};
})
应用程序过滤器（'finalAppend'，函数（$sce）{
返回函数（数组、值）{
array.push（//错误：未定义不是函数！
$sce.trustAsHtml（'在其他商店中查找'+value+'））
); 
返回数组；
}
})

提前谢谢

---

编辑：最后我刚刚去掉了过滤器，当我得到结果时，我在承诺中添加了最后一件事

问题在于函数

getProductSuggestions

没有检索数组。这是因为该函数正在发出asinc请求，并且在

then

promise的函数中设置了

return

你需要改变你的代码很多

在您看来，请执行以下操作：

<input type="text" ng-model="search" placeholder="Search for vendors or products" 
  class="form-control" 
  ng-change="updateProductSuggestions(search)" 
  ng-bind-html="match.label | typeaheadHighlight:query"
  typeahead="product for product in productSuggestions | filter:$viewValue | finalAppend:$viewValue">

另外，确保在

response.data.products

中得到的是有效数组

最后，您还可以改进

$filter

，如下所示：

app.filter('finalAppend', function($sce){
      return function(array, value){
        if(!(array && value))
            return array;
        array.push(
            $sce.trustAsHtml('Look for <b>' + value + '</b> in other shops')
        ); 
        return array;
      }
})

app.filter（'finalAppend'，函数（$sce）{
返回函数（数组、值）{
if（！（数组和值））
返回数组；
array.push(
$sce.trustAsHtml（'在其他商店中查找'+value+'））
); 
返回数组；
}
})

mmm我不明白，如果不是数组和值，它怎么会有助于工作？在我看来，if无论如何都会抛出一个错误，但你能详细说明为什么它不应该抛出一个错误吗？@Josep，ng change=“updateProductSuggestions（$viewValue）”将未定义的值传递给val。另外，我不明白当我不使用过滤器时，promise方法是如何工作的。@Riz ups！给我一点时间，让我修一下that@Riz为了解决问题，应该使用

ng change=“updateProductSuggestions（search）”

@rahpuser的

if

语句，但为了确保如果自定义

$filter

没有使用正确的参数，则不会引发异常。如果没有该

if

语句，则如果筛选器与未定义的

数组一起使用，$筛选器将抛出错误，并且如果
value
的值为
undefined
，则没有必要追加最后一行，因此应检索原始
数组。
app.controller('TypeaheadCtrl', function ($scope, $http, StateService, $timeout) {
    $scope.productSuggestions =[];
    $scope.updateProductSuggestions= function(val) {
        return $http.get(StateService.getServerAddress() + "search/autocomplete?q=" + val
            ).then(function(response){
            $timeout(function(){
                  $scope.productSuggestions = response.data.products;
            });
        });
    };
  })

app.filter('finalAppend', function($sce){
      return function(array, value){
        if(!(array && value))
            return array;
        array.push(
            $sce.trustAsHtml('Look for <b>' + value + '</b> in other shops')
        ); 
        return array;
      }
})