ng-repeatで配列にプッシュした後のAngularJs OrderBy

Question

新しい要素を押し込んで配列をソートしようとしていて、ng-repeatで変更を表示しようとしています。スコープがビューから切り離されているように見えます。

私は、ng-repeaterで示されたpeople配列を持っています。次に、姓で配列をソートする列見出し。最後に、新しい人物を追加するためのボタンと、First Nameで配列を自動的にソートしてビューに表示するボタン。

これは私のHTMLコードです：

（I also have a fiddler here）

感謝!!

<div ng-app="myApp"> 
    <div ng-controller='myController'> 
    <div> 
     <input type="button" value="Filter All" ng-click="filterAll()" /> 
     <input type="button" value="Add & Filter" ng-click="AddNFilter()" /> 
    </div><br/> 
    <div><a href="" ng-click="orderByField='lname'; reverseSort = !reverseSort">Order by LName</a></div> 
    <div ng-repeat="p in person | orderBy:orderByField:reverseSort"> 
     {{p.name}} {{p.lname}} 
    </div> 
    </div> 
</div> 

そして、私のjavascript：

var app = angular.module('myApp', []); 
app.controller('myController', function ($scope, $filter) { 
    var person = [{ 
      name: "Seimour" 
      , lname: "Duncan" 
     } 
     , { 
      name: "Engy" 
      , lname: "Wook" 
     } 
     , { 
      name: "Dame" 
      , lname: "Eyola" 
     }]; 
    $scope.person = person; 
    $scope.filterAll = function() { 
     alert('Before filter: ' + $scope.person[0].name); 
     var filtered = $filter('orderBy')($scope.person, 'name'); 
     $scope.person = filtered; 
     alert('After filter: ' + $scope.person[0].name); 
    } 
    $scope.AddNFilter = function() { 
     var p = [{ 
      name: "Ayesha" 
      , lname: "Shexper" 
     }]; 
     alert('Length before adding: ' + $scope.person.length); 
     $scope.person.push(p); 
     var filtered = $filter('orderBy')($scope.person, 'name'); 
     $scope.person = filtered; 
     alert('Length after adding: ' + $scope.person.length); 
    } 
}); 

Answer 1

まず、あなたのコードを動作させるために代わりにオブジェクトの配列で、オブジェクトにあなたのp変数を変換する必要があります。

var p = { 
    name: "Ayesha", 
    lname: "Shexper" 
}; 

セカンドスコープ内のオブジェクトを再度ソートする必要はありません。あなたは右のプロパティでフィルタリングするためにあなたのORDERBYフィルタに渡す変数を変更する場合は十分です：

$scope.orderByField = 'name'; 
$scope.reverseSort = !$scope.reverseSort; // Optional! Do it if you want to reverse the sorting 

あなたはそのことであなたのフィルタプロパティを更新するために、両方の、filterAllとAddNFilter機能でこれを行う必要があります毎回任意のアイコンをクリックします。あなたはOrder by LName

をクリックしたときに、私はあなたのフィドルを更新良いそれをやっているhere