Javascript ng重复不在控制器中渲染阵列更改

我有一个使用ng repeat在页面上显示的项目列表。下面是html

<div class="container-fluid"> 
  <div class="container" >
    <div class="page-header">
        <h3>Found {{searchResults.length}} results that match your search <br /><small>Click on any result to view details</small></h3>
    </div>
    ----
    <div class="list-group" ng-repeat="item in searchResults track by $index">
        <a ng-href="#" class="list-group-item">
            <h4 class="list-group-item-heading">{{item.test_name}}</h4>
            <p class="list-group-item-text" ng-bind-html="item.synonyms"></p>
        </a>
    </div>
</div>

找到与您的搜索匹配的{searchResults.length}}结果
单击任何结果以查看详细信息
----

此数组是在应用程序加载时创建的。下面是修改阵列的控制器中的函数

当用户在搜索框中键入内容并点击搜索时，我希望位置如代码所示进行更改，并使用ngrepeat指令显示结果列表

$scope.onClickSearch = function () {
    console.log("Search Click in Controller - " + $scope.searchString);
    $scope.searchResults = new Array();

    /*
        remove special characters and html tags from the synonyms and check if the name 
        or synonym contains the search string.
    */
        for (i = 0; i < $scope.items.length; i++) {
            var synonyms = $scope.items[i].synonyms
            var testName = $scope.items[i].test_name.toLowerCase();
            if ((testName.indexOf($scope.searchString) > -1) || (synonyms.indexOf($scope.searchString) > -1)) {
                var searchItem = $scope.items[i];
                $scope.searchResults.push(searchItem);
            }
        };
        $location.url("/search");
    });
    console.log($scope.searchResults); //Array is shown to be updated here.

$scope.onClickSearch=函数（）{
log（“在控制器中单击搜索-”+$scope.searchString）；
$scope.searchResults=新数组（）；
/*
从同义词中删除特殊字符和html标记，并检查名称是否正确
或同义词包含搜索字符串。
*/
对于（i=0；i<$scope.items.length；i++）{
var同义词=$scope.items[i]。同义词
var testName=$scope.items[i].test_name.toLowerCase（）；
if（（testName.indexOf（$scope.searchString）>-1）| |（同义词.indexOf（$scope.searchString）>-1））{
var searchItem=$scope.items[i]；
$scope.searchResults.push（searchItem）；
}
};
$location.url（“/search”）；
});
log（$scope.searchResults）//此处显示要更新的数组。

当函数更新数组时，页面上显示的html不会更改。控制台中的日志显示了正确的内容。我尝试了

$scope.$digest（）

和

$scope.$apply（）

结果没有变化

以下是有关重新创建的问题的详细信息。这应该能更详细地描述这个问题。当我键入要搜索的内容并点击搜索按钮时，视图不会显示搜索结果

我还有第二个问题，类似于这个问题，但没有得到回答。这是我的第二次尝试，但解释略有不同。

通过调用$location.url（“/search”）；您正在再次实例化控制器，因此$scope.searchResults为空 使用$rootScope保存数据，即使在重新实例化控制器之后

    catalogEditor.controller('searchController', ['$scope', '$http', 'DataFactory', '$location', '$timeout', '$rootScope'
    , function ($scope, $http, DataFactory, $location, $timeout, $rootScope) {

...
    $scope.onClickSearch = function () {
    console.log("Search Click in Controller - " + $scope.searchString);
    $rootScope.searchResults = new Array();
        for (i = 0; i < $scope.items.length; i++) {
            var synonyms = $scope.items[i].synonyms
            var testName = $scope.items[i].test_name.toLowerCase();
            if ((testName.indexOf($scope.searchString) > -1) || (synonyms.indexOf($scope.searchString) > -1)) {
                var searchItem = $scope.items[i];
                $rootScope.searchResults.push(searchItem);
            }
        };
        $location.url("/search");
    });
    console.log($rootScope.searchResults); 

catalogEditor.controller（'searchController'、['$scope'、'$http'、'DataFactory'、'$location'、'$timeout'、'$rootScope'
，函数（$scope、$http、DataFactory、$location、$timeout、$rootScope）{
...
$scope.onClickSearch=函数（）{
log（“在控制器中单击搜索-”+$scope.searchString）；
$rootScope.searchResults=新数组（）；
对于（i=0；i<$scope.items.length；i++）{
var同义词=$scope.items[i]。同义词
var testName=$scope.items[i].test_name.toLowerCase（）；
if（（testName.indexOf（$scope.searchString）>-1）| |（同义词.indexOf（$scope.searchString）>-1））{
var searchItem=$scope.items[i]；
$rootScope.searchResults.push（searchItem）；
}
};
$location.url（“/search”）；
});
log（$rootScope.searchResults）；

以下是解决方案

catalogEditor.controller('searchController', ['$scope', '$http', 'DataFactory', '$location', '$timeout', '$route', '$routeParams'
                                        , function ($scope, $http, DataFactory, $location, $timeout, $route, $routeParams) {

$scope.items = DataFactory.getSearchScope();
$scope.selectedCatalogCd = '';
$scope.searchString = '';
// Get our stored data, or, a blank array;
$scope.searchResults = DataFactory.get() || [];

function init() {
    $route.reload(); // had to force a reload for the changes to be displayed
}

$scope.onItemSelected = function () {
    console.log("In Controller - " + $scope.selectedCatalogCd);
    $location.path("/details/" + $scope.selectedCatalogCd + ".json");
};

$scope.onClickSearch = function () {
    console.log("Search Click in Controller - " + $scope.searchString);
    /*
        remove special characters and html tags from the synonyms and check if the name 
        or synonym contains the search string.
    */
    $scope.searchResults = [];
    for (i = 0; i < $scope.items.length; i++) {
        var synonyms = $scope.items[i].synonyms
        if (synonyms !== "") {
            synonyms = synonyms.replace(/(<(\s*)(br)(\s*)>)/gi, ' ');
            synonyms = synonyms.replace(/[^\w\s]/gi, '').toLowerCase();
        }
        var testName = $scope.items[i].test_name.toLowerCase();
        if ((testName.indexOf($scope.searchString.toLowerCase()) > -1) || (synonyms.indexOf($scope.searchString) > -1)) {
            var searchItem = $scope.items[i];
            $scope.searchResults.push(searchItem);
        }
    }
    // Store the data;
    console.log("New Size of Search Results - ", $scope.searchResults.length);
    DataFactory.set($scope.searchResults);
    $scope.searchResults = [];
    if ($location.path() !== '/search') {
        $location.path("/search");
        $location.replace();
    } else {
        init();
    }
};
}])

catalogEditor.controller（'searchController'、['$scope'、'$http'、'DataFactory'、'$location'、'$timeout'、'$route'、'$routeParams'
，函数（$scope、$http、DataFactory、$location、$timeout、$route、$routeParams）{
$scope.items=DataFactory.getSearchScope（）；
$scope.selectedCatalogCd=''；
$scope.searchString=''；
//获取存储的数据或空白数组；
$scope.searchResults=DataFactory.get（）| |[]；
函数init（）{
$route.reload（）；//必须强制重新加载才能显示更改
}
$scope.mselected=函数（）{
console.log（“在控制器中-”+$scope.selectedCatalogCd）；
$location.path（“/details/”+$scope.selectedCatalogCd+”.json”）；
};
$scope.onClickSearch=函数（）{
log（“在控制器中单击搜索-”+$scope.searchString）；
/*
从同义词中删除特殊字符和html标记，并检查名称是否正确
或同义词包含搜索字符串。
*/
$scope.searchResults=[]；
对于（i=0；i<$scope.items.length；i++）{
var同义词=$scope.items[i]。同义词
如果（同义词！==“”）{
同义词=同义词。替换（/（）/gi，）；
同义词=同义词。替换（/[^\w\s]/gi'，）.toLowerCase（）；
}
var testName=$scope.items[i].test_name.toLowerCase（）；
if（（testName.indexOf（$scope.searchString.toLowerCase（））>-1）| |（同义词.indexOf（$scope.searchString）>-1））{
var searchItem=$scope.items[i]；
$scope.searchResults.push（searchItem）；
}
}
//存储数据；
log（“搜索结果的新大小-”，$scope.searchResults.length）；
DataFactory.set（$scope.searchResults）；
$scope.searchResults=[]；
如果（$location.path（）！='/search'）{
$location.path（“/search”）；
$location.replace（）；
}否则{
init（）；
}
};
}])

这是一个有点笨拙，但它的工作。没有其他解决方案，我可以找到。该应用程序不是一个非常高的流量应用程序，所以它会做得很好。 这是更新的plunker

谢谢，

---

第

段您是否尝试在方法之外声明$scope.searchResults，看看它是否会更改？这给了我一些思考。我在方法之外得到了一个空数组。您可以将$scope.items的结果记录在该控制器中吗？它是否有内容？是的，它确实有内容。请随意编辑它，但是如果它不起作用，我使用工厂存储搜索结果，然后恢复，然后重新加载。