technogav / Grababite-1.3

version 1.3
0 stars 0 forks source link

Problem with data persisting when new data is passed in #2

Open technogav opened 7 years ago

technogav commented 7 years ago

I have a page working on its own controller. When the page is navigated to it is passed data from another controller via the service. The data passed initially appears in the view but later, when another object is passed to the view the view does not reflect the change and keeps the initial data displayed.

here is my service

    var dealToEdit = [];
rFactory.setDealToEdit = function(deal){
    dealToEdit = deal;
};

   rFactory.getDealToEdit = function(){
    return dealToEdit;
};

The controller that sets the data (as mentioned works the first time but not after that)

$scope.pastDealEdit = function(deal){ RestaurantFactory.setDealToEdit(deal); $location.path('/page103'); }

The controller on the view in question

.controller('editDealsCtrl', ['$scope', '$stateParams', 'RestaurantFactory', function ($scope, $stateParams, RestaurantFactory) { "use strict";

$scope.dealToEdit = RestaurantFactory.getDealToEdit();
//THE VIEW IS FAILING TO UPDATE WITH NEW DETAILS WHEN NEW DEAL IS CLICKED ON THE DEALS CONTROLLER (PREVIOUS PAGE)

//CONSOLE.LOG ONLY SEEMS TO FIRE ONCE EVEN WHEN RETURNING TO PREVIOUS PAGE AND CLICKING ANOTHER OBJECT TO BE PASSED IN //THE SECOND TIME AROUND THE CONSOLE.LOG IN THE SERVICE DISPLAYS ACCURATLY THE OBJECT PASSED IN console.log($scope.dealToEdit);

image

technogav commented 7 years ago

image

dimkir commented 7 years ago

My understanding is that your editDealsCtrlis fully loaded only once per lifetime of the app. Which means that your:

$scope.dealToEdit = RestaurantFactory.getDealToEdit();

line is executed only one time (the first time you load the page). And when after some time you return back to this page, the "initialization" part of your code (where the above line resides). Is not triggered again and thus you don't see the change.

You have 2 approaches here:

Quick Hack

You can "clear" or "disable" caching of views (which means that once you navigate away from the view, it's controller and DOM will be destroyed and will be reloaded from fresh when you open/return to the view again:

For that you can specify cache: false on view configuration

  .state('app.list', {
    cache : false, // this will disable view caching which is enabled by default
    url: "/lists/:listId",
    views: {
      'menuContent': {
        templateUrl: "templates/listDashboard.html",
        controller: 'listDashboardCtrl'
      }
    }
  })

Right way

Inside of your controller you want to be aware or informed when the "view comes into screen" or when "view goes away from the screen". For that ionic has special events you can subscribe to inside of your controller:

You can see more info on how they work http://ionicframework.com/docs/api/directive/ionView/ and https://forum.ionicframework.com/t/detecting-when-a-user-has-moved-off-a-view/14789/4