2017-01-13 18 views
0

ng-repeatを使用してページに表示されるアイテムのリストがあります。以下はhtmlです。コントローラで実際の配列が変更されても、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は変更されません。 That is what I see.

UPDATE:ここ を再作成問題とplunkerです。検索ボタンを押すと、検索結果が表示されません。

+0

にはエラーではありませんか? – rala

+0

コンソールでエラーなし – pparas

+0

はい。ログが正しく表示されています。 – pparas

答えて

0

トラッキングの問題がある可能性があります。トラッキングを更新するために「トラッキング」構文を使用することを検討してください。 ngRepeatドキュメント上

詳細情報:コンソールで https://docs.angularjs.org/api/ng/directive/ngRepeat

+0

は機能しません。 – pparas

関連する問題