1

を呼び出したときに更新指令検索が

https://plnkr.co/edit/aoGESy8pYAEIVErKr8QF?p=preview

<!doctype html> 
 
<html ng-app="plunker" > 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <title>AngularJS Plunker</title> 
 
    <link rel="stylesheet" href="style.css"> 
 
    <script>document.write("<base href=\"" + document.location + "\" />");</script> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.js"></script> 
 
    <script src="app.js"></script> 
 
    <script src="search.js"></script> 
 
</head> 
 
<body ng-controller="MainCtrl"> 
 
    <search dir-name="list-view1"></search> 
 
    <list-view1></list-view1> 
 
    
 
    <search dir-name="list-view2"></search> 
 
    <list-view2></list-view2> 
 
</body> 
 
</html>

angular.module('plunker', []); 
 

 
function MainCtrl($scope) { 
 
    $scope.name = 'World'; 
 
} 
 

 

 
angular.module('plunker').directive('listView1', function(){ 
 
    
 
    return { 
 
    restrict: 'E', 
 
    templateUrl: 'list-view1.html', 
 
    controller: function($scope) { 
 
     $scope.items = [1,2,3,4,5]; 
 
    }, 
 
    
 
    replace: true, 
 
    link: function(scope, elem, attr) { 
 
     
 
    } 
 
    }; 
 
}); 
 

 

 
angular.module('plunker').directive('listView2', function(){ 
 
    
 
    return { 
 
    restrict: 'E', 
 
    templateUrl: 'list-view2.html', 
 
    controller: function($scope) { 
 
     $scope.items = [6,7,8,9,10]; 
 
    }, 
 
    
 
    replace: true, 
 
    link: function(scope, elem, attr) { 
 
     
 
    } 
 
    }; 
 
});

plnkr確認してください、我々は2ディレクティブのリストビューを持っています1とlist-view2を使用しています。また、すべての場所で共通の検索指示があります。私は、リスト-VIEW1のデータがリストVIEW2のために同様に

を更新する必要があり、リスト-VIEW1の検索をクリックしたときに

今私の要件があります。

シナリオは、私がデータを返すAPI呼び出しをする必要があります。データを受け取った後、私は呼び出しが行われた場所から新しいデータでリストビューを更新する必要があります。

いずれのアイデアも大きな助けになります。

答えて

0

html要素にアイテムをバインドすると、アイテムが更新されるとビューが自動的に更新されます。例えば、

あなたが

$scope.search = function(){ 
    $scope.items = getNewItems(); 
} 

のようなコントローラでの機能を持っていて、ビューに

<button ng-click="search()">Search</button> 
<ul> 
    <li ng-repeat="item in items"> {{item}} </li> 
</ul> 

アイテムをそのような何かを持っている場合は、検索ボタンにこの機能を添付しました検索ボタンを押すと、ビュー内の画像が更新されます。

+0

私はあなたの解決策をplnkrで理解できませんでした。それは大きな助けになるでしょう –

+0

http://plnkr.co/edit/HFglboQaCSl1J2uIeyKk?p=previewここで見るように、データが自動的に更新されたビューを変更したとき。 –

+0

あなたは私の質問を正しく理解していないと思います。それを読んでシナリオを理解してみてください –