Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Require JS Compatibility #104

Open
Alirz opened this issue Sep 8, 2015 · 0 comments
Open

Require JS Compatibility #104

Alirz opened this issue Sep 8, 2015 · 0 comments

Comments

@Alirz
Copy link

Alirz commented Sep 8, 2015

Hi,
because I used require js in my app , I wrote a routing service. in that service I was injecting my controller. So how can I use your modules for nested routing?

this is my routing service :

define([], function () {

    var services = angular.module("routeResolverServices", []);
    var pagetitle = '';
    services.provider("routeResolver", function () {
        this.$get = function () {
            return this;
        };

        this.routeConfig = function () {

            var viewsDirectory = "app/templates/",
                controlleDirectory = "app/controllers/",
                setBaseDirectories = function (viewDir, controllerDir) {
                    viewsDirectory = viewDir;
                    controlleDirectory = controllerDir;

                },
                getViewDirectory = function () {
                    return viewsDirectory;
                },
                getControllerDirectory = function () {
                    return controlleDirectory;
                };

            return {
                setBaseDirectories: setBaseDirectories,
                getViewDirectory: getViewDirectory,
                getControllerDirectory: getControllerDirectory
            };
        }();

        this.route = function (routeConfig) {
            var resolve = function (access, baseName, controllerName, viewName,title) {
                var routeDef = {};
                routeDef.templateUrl = routeConfig.getViewDirectory() + baseName + "/" + (viewName == undefined ? baseName : viewName) + ".html?v=1.6.6";
                routeDef.controller = (controllerName == undefined ? baseName : controllerName) + "Controller";
                routeDef.caseInsensitiveMatch = true;
                routeDef.resolve = {
                    load: ["$q", "$rootScope", "$location", "$window", function ($q, $rootScope, $location, $window) {
                        var dependency = [routeConfig.getControllerDirectory() + baseName + "/" + (controllerName == undefined ? baseName : controllerName) + "Controller.js"];
                        pagetitle = title;

                        return resolveDependencies($q, $rootScope, $location, $window, dependency);
                    }]
                };

                return routeDef;
            },
                resolveDependencies = function ($q, $rootScope, $location, $window, dependencies) {
                    var defer = $q.defer();
                    require(dependencies, function () {
                        defer.resolve();
                        $rootScope.$apply();
                    });
                    $rootScope.$on('$routeChangeSuccess', function (event, current, previous) {
                        $rootScope.pageTitle = pagetitle;

                    });
                    $rootScope.$on('$locationChangeSuccess',
                            function (event, current, previous) {

                                $rootScope.$previouslocation = previous;
                            });
                    $rootScope.back = function () {
                        setTimeout(function () {
                            $window.history.back();
                        }, 0);
                    };
                    return defer.promise;
                };
            return {
                resolve: resolve
            };

        }(this.routeConfig);

    });

})

this is my app.js

define(["services/routeResolverService"], function () {
    var app = angular.module('app', [
            "routeResolverServices",
            "ngResource",
            "ngRoute"
         ]);
    app.config(['$routeProvider',
        'routeResolverProvider',
        '$controllerProvider',
        '$provide',
        function ($routeProvider, routeResolverProvider, $controllerProvider, $provide) {


            app.register = {
                controller: $controllerProvider.register,
                factory: $provide.factory,
                service: $provide.service
            };

            var route = routeResolverProvider.route;


            map.forEach(function (row) {
                var words = row.split(",");
                $routeProvider.when(words[0], route.resolve(words[1], words[2], words[3], words[4], words[5]));
            });
            $routeProvider.otherwise({ redirectTo: "/user/main" });

        }]);


    return app;
});

and this is my sample controller

define(['app'], function (app) {
    app.register.controller('SendMessageController', ["$scope", 
        function ($scope) {

    }]);
})

and this is my routemap, including URL, Controller and Template Directories

var map=[
"/sendmessage/:mailid,public,SendMessage,SendMessage,SendMessageView"
]
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant