Question

我有一个使用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">
                <a ng-href="/#/details/{{item.test_catalog_cd}}.json" 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>
    </div>

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

$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.

当函数更新数组时，页面上显示的html不会改变。

更新这是一个带有重新创建问题的plunker。当我输入要搜索的内容并点击搜索按钮时，该视图不会显示搜索结果。

Answer 1

可能存在跟踪问题 - 请考虑使用“track by”语法更新跟踪。

有关ngRepeat文档的更多信息： https://docs.angularjs.org/api/ng/directive/ngRepeat

即使实际数组在控制器

1 个答案: