When using an array as an itemDataSource on a ListView, edits within the ListView do not get propagated to the array. Consequently, other UI that depends on that array will not get updated.
Repro Steps
// JavaScript
var module = angular.module('sample', ['winjs']).controller("sampleController", function ($scope) {
$scope.list = [1, 2, 3, 4, 5];
$scope.edit = function () {
var tmp = $scope.list[0];
$scope.list[0] = $scope.list[1];
$scope.list[1] = tmp;
};
});
WinJS.UI.processAll();
<!-- HTML -->
<div ng-controller="sampleController">
<h2>ng-repeat</h2>
<button ng-click="edit()">Swap First 2 Items</button>
<ul>
<li ng-repeat="n in list">{{n}}</li>
</ul>
<h2>ListView</h2>
<win-list-view item-data-source='list' items-reorderable="true">
<win-item-template>{{item.data}}</win-item-template>
</win-list-view>
</div>
In the ListView, click and drag 5 to make it the first item in the list.
Expected result:5 is now the first element in the ListView and in the ng-repeat
Actual result:1 is still the first item in the ng-repeat. The ng-repeat is out of sync.
Note: By clicking the "Swap First 2 Items" button, you can see that the ng-repeat and ListView are properly hooked up to the same array. They both update in response to this edit.
Impact
When using an array as an
itemDataSource
on a ListView, edits within the ListView do not get propagated to the array. Consequently, other UI that depends on that array will not get updated.Repro Steps
5
to make it the first item in the list.Expected result:
5
is now the first element in theListView
and in theng-repeat
Actual result:
1
is still the first item in theng-repeat
. Theng-repeat
is out of sync.Note: By clicking the "Swap First 2 Items" button, you can see that the
ng-repeat
andListView
are properly hooked up to the same array. They both update in response to this edit.