Problem with collection-repeat and updating items

ionic-v1
1

Hi everyone.

I’m trying to use collection-repeat like this:

collection-repeat="order in orders"

The problem is when i try to update some data in one of the order and then add this changed order to orders and go back from order-detail page to main page with order list - something wrong with collection-repeat:
Looks like my order-list is frozen: I don’t see updated information in the order, and also scroll doesn’t work… The new updated information apply only after i click to select box to filtering the list, or i try to search on the page…

I save orders in the $rootScope.orders and i can see the changed data in this variable. Early when i used ng-repeat everything worked good! But now i need to use collection-repeat because list contains more than 900 elements.

Main view code below:

<ion-view view-title="Ordrer" class="orders">
    <ion-content class="padding" delegate-handle="MainScroll" direction="y" on-scroll="getScrollPosition()">  
        <ion-list>
            <a class="item item-avatar" collection-repeat="order in orders | filter:orderFilter | orderBy: sorting.Index"
                item-width="100%"
                href="#/orders/{{order.order_no}}/"
                ng-style="{width: '100%'}"
                item="item">
                <img ng-src="img/{{order.shop_id}}-logo.jpg"> 
                <h2>{{order.ship_to_name}} <span class="order-no">{{order.order_no}} # {{order.no}}</span></h2>
            </a>
        </ion-list>
    </ion-content>
</ion-view>

Controller and service where i’m trying to update the order:

Controller:

$scope.saveData = function() {
     .....
     $scope.order.title = 'Hello world';
     ordersManager.setOrder($scope.order);
}

Service:

setOrder: function(orderData) {
....
        for (var i = 0; i < $rootScope.orders.length; i++) {
            if($rootScope.orders[i].order_no === orderData.order_no) {
                $rootScope.orders[i] = orderData;
                console.log($rootScope.orders[i]);
                break;
            }
        }

        return order;
    },

Ionic version is #1.0.0-rc.2

Can anyone help me with this problem?

Thanks!

2

Looks like the problem with cached view.

When i add cache-view=“false” to main view everything works fine, but scroll position doesn’t save now.

3

If you don’t want to disable caching, but want specific code to be called each time a view is entered, you can use this in your controller:

$scope.$on('$ionicView.enter', function() {
  // code to run each time view is entered
});
1 Like
4

Thanks for reply, Brandy

When i try this code to change the orders array i get the same error like before.
I’m using it like this for update orders in collection-repeat:

<a class="item item-avatar" collection-repeat="order in orders></a>

$scope.$on('$ionicView.enter', function() {
    for (var i = 0; i < $rootScope.orders.length; i++) {
            if($rootScope.orders[i].order_no === $rootScope.order.order_no) {
                $rootScope.orders[i] = $rootScope.order;
                break;
           }
  }
        
});
5

I found that i have the same problem like in this question: Collection-repeat and view cache weirdness

i have the modal in my detail view too.

Looks like it already fixed, but i’m using the newest version and still have this bug

6

Can you reproduce this in a Codepen? I changed the Codepen attached to that issue to use 1.0.0-rc.2 and don’t see the bug.

7

Yeah sure, can u give me a link to the attached Codepen?

8

Here is the codepen edited for rc.2: