Angular js:使用require js时如何使用resolve

时间:2014-04-07 09:49:26

标签: javascript jquery angularjs requirejs

我正在使用带有angular-js的required-js来加载我的项目中的一个脚本文件。在正常情况下,我需要将js用于存储变量并将变量绑定到该变量,并且在app配置中我可以提及解析函数。    但是通过使用required-js,我定义了模块中的所有内容。所以我正在创建控制器模块并在那里存储控制器,所以使用控制器名称而不是function.below是我的配置和控制器模块的代码。我不想在配置中编写我的解析逻辑。它应该在控制器文件中。我怎么能用角度js。

define(
    ['angular', 'angular-route', 'controllers', 'directives', 'filters', 'services', 'common-controllers', 'common-directives', 'common-helpdesk-feedback-directives', 'common-constants', 'plunker', 'require'],
    function(angular, angularRoute, controllers, directives, filters, services, commonControllers, commonDirectives, commonHelpDeskFeedbackDirectivesModule, plunker) {
        var app = angular.module('app', ['ngRoute', 'controllersModule', 'directivesModule', 'filtersModule', 'servicesModule', 'commonControllersModule', 'commonDirectivesModule', 'commonHelpDeskFeedbackDirectivesModule', 'plunkerModule']);
        app.init = function() {

            setTimeout(function() {
                angular.bootstrap(document, ['app']);
            }, 2000)
        }
        app.config(function($routeProvider, $httpProvider) {
            $routeProvider
                .when('/', {
                    template: '<div align="center"  ><h1>This is default helpdesk page !</h1></div>',
                })
                .when('/list/:view', {
                    templateUrl: '../../themes/ngCus/templates/helpdesk/listing.html',
                    controller: 'listCtrl',
                });

        });
        return app;

    }
);

这是我的控制器模块

// Define all your controllers here in controller angular module
define(['angular'], function function_name (angular) {
    var controller = angular.module('controllers', []);
    controller.controller('listCtrl', ['$scope', function($scope){
        $scope.message = 'This is dashboard default page !';
    }]);
    return controller;
});

1 个答案:

答案 0 :(得分:0)

她是一个答案

控制器文件中的

/*reslve function for listCtrl */
    controllersModule.resolvelistCtrl = function($q, $timeout) {
        /*resolve logic here*/
    };

/*reslve function for otherCtrl*/
        controllersModule.resolveOtherCtrl = function($q, $timeout) {
            /*resolve logic here*/
        };

在bootstrap文件中

  define(
        ['angular', 'angular-route', 'controllers', 'directives', 'filters', 'services', 'common-controllers', 'common-directives', 'common-helpdesk-feedback-directives', 'common-constants', 'plunker', 'require'],
        function(angular, angularRoute, controllers, directives, filters, services, commonControllers, commonDirectives, commonHelpDeskFeedbackDirectivesModule, plunker) {
            var app = angular.module('app', ['ngRoute', 'controllersModule', 'directivesModule', 'filtersModule', 'servicesModule', 'commonControllersModule', 'commonDirectivesModule', 'commonHelpDeskFeedbackDirectivesModule', 'plunkerModule']);
            app.init = function() {

                setTimeout(function() {
                    angular.bootstrap(document, ['app']);
                }, 2000)
            }
            app.config(function($routeProvider, $httpProvider) {
                $routeProvider
                    .when('/', {
                        template: '<div align="center"  ><h1>This is default helpdesk page !</h1></div>',
                    })
                    .when('/list/:view', {
                        templateUrl: '../../themes/ngCus/templates/helpdesk/listing.html',
                        controller: 'listCtrl',
                        resolve: {
                            detailsData: controllers.rsolvelistCtrl,
                            otherData: controllers.resolveOtherCtrl
                            /*we can add more here*/
                        },
                    });

            });
            return app;

        }
    );