简体   繁体   中英

Inheritance variable from root controller with ui-view in AngularJS

My application does a http call, the result is stored in a variable in the scope.

angular.module('simfraAppController', [])
.controller('simfraController', ['$scope', 'RetrieveInformation', 'RetrieveTaxInformation', 'ErrorModal',
    function ($scope,RetrieveInformation, RetrieveTaxInformation, ErrorModal) {
        $scope.formData = {};

        RetrieveInformation.then(function success(response) {
            $scope.personalData = response.data.data;

        }, function error(response) {
            ErrorModal();
        });

        RetrieveTaxInformation.then(function success(response) {
            $scope.taxData = response.data.data;

        }, function error(response) {
            ErrorModal();
        });
    }
]);

.state('landing', {
    url: "/",
    templateUrl: "simfra/dashboard.html"
})

In this controller is the call made and sto in the variable.

This is my other controller

.controller('SimfraDirectDebitApplicationController', ['$scope',    '$rootScope', '$state', 'Command', 'uuid4',
    function ($scope, $rootScope, $state, Command, uuid4) {

    console.log($scope.personalData);
});

.state('direct_debit_application', {
                url: "/incassoaanvraag",
                templateUrl: "simfra/direct-debit-application/inquiry.html"
 })

Ofcourse i have nested the html.

<body data-ng-controller="simfraController">
    <div data-ng-controller="SimfraDirectDebitApplicationController">
    </div>
</div>

My problem is when i init the application trough the default route "/" and i navigate to the route "direct_debit_application" it all works great.

BUT, when i reload the page, the request is still being made (as far as i can see in the console) but the variable is 'undefined'

How can i get this thing to work properly?

This worked for me

set the value in First controller using following code

$scope.$emit('key', {data: value}); //to set the value

Get the value in second controller using follwing code

 $rootScope.$on('key', function (event, data) {}); //to get the value

or you can try getter setter methods too

I know why its not working!!

The $http request is still being made and the DOM has been loaded. So as result the variable is empty.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM