0

Hi I'm new to angularjs and I'm using $rootScope to change a $scope variable on $stateChangeSuccess. The problem is, i get an error message that says, "TypeError: Cannot set property 'show' of null". This is a snipet of my code

    // unhide this view whenever visited
    $rootScope.$on('$stateChangeSuccess', function(event, toState, toParams, fromState,     fromParams) {
        $scope.$parent.show = false;
        alert($scope.$parent.show);
        return $scope.$parent.show;

});

and the html ... 

<div class="row">
    <div class="dl-horizontal" id="information">
        <div class="col-md-8 col-md-offset-2">

        <!-- route veiw, hide the child view initailly -->
        <div ui-view ></div>
    </div>

    <div class="col-md-8 col-md-offset-2" ng-hide="show">

Basically, I want to unhide the parent view whenever I get out of the child state. The $scope variable has a value to it and the code works, it's just that I get this error message. Any ideas on how to solve this error?

Thanks

Justin Case
  • 787
  • 2
  • 15
  • 30

2 Answers2

1

If you want to avoid using root scope, you can add the $on to the $scope that holds the property that you wish to change.

For example:

controller: function($scope, $stateParams, carsDataService) {
    $scope.model = {};
    $scope.model.cars = carsDataService.getCars();
    $scope.pageState = { selectedCarId: null };

    $scope.$on('$stateChangeStart', function(event, toState, toParams,    fromState, fromParams){
        $scope.pageState.selectedCarId = toParams.id;
    });
}
CT Arrington
  • 31
  • 2
0

You can't access a child scope inside a listener of the $rootScope.

Just set your property on the $rootScope and, if your scope isn't isolated, it will be accessible from children scopes.

Guillaume Besson
  • 572
  • 2
  • 8