Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.

I'm using Angular UI-router and trying to download/load controller when the routing changes. I used resolve and category, the data.data returns the js file content as string. I'm not sure to make the controller available to angular. Please help

My module.js contains below routing code

state("privacy", {
        url: "/privacy",
        controllerProvider: function ($stateParams) {
            return "PrivacyController";
        },
        resolve: {
            category: ['$http', '$stateParams', function ($http, $stateParams) {
                return $http.get("js/privacy.js").then(function (data) {
                    return data.data;
                });
            } ]
        },
        templateUrl: localPath + "templates/privacy.html"
    })

The below controller exist in "js/privacy.js"

socialinviter.controller("PrivacyController", function ($scope) { $scope.me = "Hellow world"; });

I also tried with require js but I'm getting error "http://errors.angularjs.org/1.2.16/ng/areq?p0=PrivacyController&p1=not%20aNaNunction%2C%20got%20undefined"

resolve: {
            deps: function ($q, $rootScope) {
                var deferred = $q.defer(),
                    dependencies = ["js/privacy"];
                    require(dependencies, function () {
                        $rootScope.$apply(function () {
                            deferred.resolve();
                        });
                        deferred.resolve()
                    })
                return deferred.promise;
            }
        }
share|improve this question
    
Is PrivacyController defined inside data.data? –  PSL Oct 9 '14 at 0:17
    
PrivacyController is defined on a separate file, the $http.get is downloading that file and the data.data contains socialinviter.controller("PrivacyController", function ($scope) { $scope.me = "Hellow world"; }); –  Navin Leon Oct 9 '14 at 0:22
    
You cannot do that. You are just downloading a file.. –  PSL Oct 9 '14 at 0:23
    
I also tried with requirejs, see the above code, it download the file but it throws error. –  Navin Leon Oct 9 '14 at 0:28

1 Answer 1

up vote 0 down vote accepted

I have resolved the issue and I thought the solution would be helpful for others

Step 1: On your config, include the parameter $controllerProvider

mytestapp.config(function ($stateProvider, $controllerProvider) 

Step 2: telling angular to register the downloaded controller as controller, add the below inside the config

mytestapp.config(function ($stateProvider, $controllerProvider) {
mytestapp._controller = mytestapp.controller
mytestapp.controller = function (name, constructor){
    $controllerProvider.register(name, constructor);
    return (this);
}
......

Step 3: Add the resolve method as below

state("privacy", {
        url: "/privacy",
        controller: "PrivacyController",
        resolve: {
            deps : function ($q, $rootScope) {
                var deferred = $q.defer();
                require(["js/privacy"], function (tt) {
                    $rootScope.$apply(function () {
                        deferred.resolve();
                    });
                    deferred.resolve()
                });
                return deferred.promise;
            }
        },
        templateUrl: "templates/privacy.html"
    })
share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.