How to resolve the cookieStore is not defined error in angular js?

angular-cookies, angularjs, angularjs-digest, geocode, google-geocoder

Solution

May be you are messing with angular-cookies dependency. And after changing value in $rootScope you need to run digest cycle manually using `$rootScope.$apply()`

CODE

angular.module('MyApp', ['ngCookies'])
    .controller('MyCtrl', ['$scope', '$http', "$rootScope", "$cookieStore", "$q", function ($scope, $http, $rootScope, $cookieStore, $q) {
    $scope.names = [{
        "id": 1,
        city: "abc",
        lat: 123,
        long: 345
    }, {
        "id": 2,
        city: "asd",
        lat: 123,
        long: 345
    }, {
        "id": 3,
        city: "dfg",
        lat: 123,
        long: 345
    }];
    //mock ajax
    $scope.storeAreaInCookie = function (area) {
        var geocoder = new google.maps.Geocoder();
        var lat = "";
        var long = "";
        geocoder.geocode({
            'address': area.city
        }, function (results, status) {
            if (status == google.maps.GeocoderStatus.OK) {
                $rootScope.lat = results[0].geometry.location.lat();
                $rootScope.long = results[0].geometry.location.lng();
                $rootScope.$apply()
                $cookieStore.put('lat', $rootScope.lat);
                $cookieStore.put('long', $rootScope.long);
                alert("lat" + $cookieStore.get('lat'));
                alert("long" + $cookieStore.get('long'));
            } else {
                alert("Something went wrong " + status);
            }
            //codeLatLng($rootScope.lat, $rootScope.long);
            $(document).ready(function () {
                $("#locationView").slideToggle();
            });
        });

    };
}]);

Working Fiddle

Hope this could help you, Thanks.

Problem

Here when i click on storeAreaInCookie that will result the lat and long of the city those results i have to store in cookies and need to use where ever i want to use in my website.But when am tried to use this code it not storing the cookie and in it console saying that cookie store is not defined.how can i resolve this problem? ``` <div ng-app="MyApp" ng-controller="MyCtrl"> <div ng-repeat="x in names"> <div ng-click="storeAreaInCookie(x.city)" >{{x.city}}</div> </div> </div> <script> angular.module('MyApp', ['ngCookies']) .controller('MyCtrl', ['$scope', '$http',"$rootScope", "$cookieStore", function($scope, $http, $rootScope, $cookieStore) { $scope.storeAreaInCookie = function (area) { var geocoder = new google.maps.Geocoder(); var lat=""; var long=""; geocoder.geocode( { 'address': area}, function(results, status) { if (status == google.maps.GeocoderStatus.OK) { $rootScope.lat=results[0].geometry.location.lat(); $rootScope.long=results[0].geometry.location.lng(); } else { alert("Something went wrong " + status); } codeLatLng($rootScope.lat,$rootScope.long); $(document).ready(function(){ $("#locationView").slideToggle(); }); }); $cookieStore.put('lat',$rootScope.lat); $cookieStore.put('long',$rootScope.long); alert("lat"+$cookieStore.get('lat')); alert("long"+$cookieStore.get('long')); }; }]); </script> ```

Original source