1

I have two different views but for both of them there is only one controller as they have several things in common. But when the second view is loaded all the data stored in the scope of the first view is lost. For this problem I found this very nice solution here

This solution looks good only if I have few number of data in scope, which is not the case of mine. I have several data stored in the controller scope. So I wanted to have a way to iterate over the data(only data saved by me not angular's data), but I am not sure how do I iterate over these value. Any thoughts?

Community
  • 1
  • 1
me_digvijay
  • 5,374
  • 9
  • 46
  • 83
  • not clear what you mean by `angular data` vs your data – charlietfl Jul 19 '14 at 20:04
  • @charlietfl: If you console the `$scope` variable, you can see whole lots of data/properties stored in it starting with `$` or `$$`. – me_digvijay Jul 19 '14 at 20:10
  • 1
    easy to fix... use `angular.copy()` , will strip out all the `$$hashkey` properties. Also when you send data with `$http` it will strip it too. – charlietfl Jul 19 '14 at 20:13
  • I don't understand the solution to that other post. Why not just separate your services - one to track view concerns (i.e. orderBy, filters, etc), and another to track your data (i.e. UserService), rather than trying to save/restore state from scope. The scope is a mediator for the model, not the model itself. – Michael Kang Jul 19 '14 at 21:25

1 Answers1

1

i had somewhat similar requirement and i have created a directive for the same purpose

csapp.directive("csDataStore", ["$location", "$sessionStorage", function ($location, $sessionStorage) {

    var controllerFunction = ["$scope", function ($scope) {

        var enter = function () {
            var storedValue = $sessionStorage[$scope.key];
            if (angular.isDefined(storedValue)) $scope.value = storedValue;
            $scope.onLoad();
        };
        enter();

        var exit = function () {
            $sessionStorage[$scope.key] = $scope.value;
        };
        $scope.$on("$destroy", function () { exit(); });
    }];

    return {
        restrict: "E",
        scope: { key: '@', value: '=', onLoad: '&' },
        controller: controllerFunction
    };
}]);

i use the directive like this

<cs-data-store key="stkh.view" value="filter" on-load="loadData()"></cs-data-store>

so what we have here are 3 parameters: key/value and then what to do on loading that value in the scope... so a callback function on-load, which would be called after the the key has been loaded in the $scope

i used $sessionStorage, to keep values even between page refresh...

harishr
  • 17,807
  • 9
  • 78
  • 125