關於angularjs + requirejs的問題

嘗試使用requirejs實現模塊化加載到angularjs中。難以理解requirejs及其配置選項。這是迄今爲止我所擁有的。我的問題是下面關於angularjs + requirejs的問題

的index.html

<!DOCTYPE HTML> 
<html> 
<head> 
    <link href="app/vendor/bootstrap/bootstrap.min.css" rel="stylesheet"> 
    <link href="app/css/style.css" rel="stylesheet"> 
    <script data-main="app/main.js" src="app/vendor/require/require-2.1.11.min.js"></script> 
</head> 
<body> 
    <div id="wrapper"> 
     <div ng-include="flexyLayout('header')"></div> 
     <div ng-view id="content"></div> 
     <div ng-include="flexyLayout('footer')"></div> 
    </div> 
</body> 
</html>

main.js

require.config({ 
    paths: { 
     'angular': 'vendor/angular/angular.min', 
     'angular-route': 'vendor/angular/angular-route.min', 
     'angular-cookies': 'vendor/angular/angular-cookies.min' 
    }, 
    shim: { 
     angular: { 
      exports: 'angular' 
     }, 
     'angular-route' : { 
      exports : 'angular', 
      deps : ['angular'] 
     }, 
     'angular-cookies' : { 
      deps : ['angular'] 
     } 
    } 
}); 

require(
    [ 
     'angular', 
     'app', 
     'module/login/login', 
     'services/services' 
    ], 
    function(angular, app) { 
     'use strict'; 
     angular.bootstrap(document, ['myApp']); 
    });

app.js

define(['angular', 'angular-route'], function(angular) { 
    var app = angular.module("myApp", ['ngRoute']); 

    app.config(function ($routeProvider,$httpProvider) { 
     $routeProvider 
      .when('/', { 
       templateUrl: 'app/module/public/index.html', 
       header: 'app/partials/header.html', 
       footer: 'app/partials/footer.html' 
      }) 
      .when('/login', { 
       templateUrl: 'app/module/login/login.html', 
       header: 'app/partials/header.html', 
       footer: 'app/partials/footer.html' 
      }) 
      .when('/home', { 
       templateUrl: 'app/module/home/home.html', 
       header: 'app/partials/header.html', 
       footer: 'app/partials/footer.html' 
      }) 
      .when('/register', { 
       templateUrl: 'app/module/register/register.html', 
       header: 'app/partials/header.html', 
       footer: 'app/partials/footer.html' 
      }) 
      .when('/admin', { 
       templateUrl: 'app/module/admin/admin.html', 
       header: 'app/partials/header.html', 
       footer: 'app/partials/footer.html', 
       permission: 'admin' 
      }) 
      .when('/unauthorized', { 
       templateUrl: 'app/partials/unauthorized.html', 
       header: 'app/partials/header.html', 
       footer: 'app/partials/footer.html' 
      }) 
      .otherwise({redirectTo: '/'}); 
    }); 

    return app; 
});

define(['app','services/services'], function (app) { 
    app.controller('LoginCtrl', function($scope,AuthenticatorService,CookieService,$window,$location) { 
     $scope.user = {}; 

     $scope.login = function() { 
      AuthenticatorService.authenticate($scope.user).then(function(response){ 
       if(response.authentication) { 
        CookieService.saveLoginData(response.user); 
        $window.location.href = $location.absUrl()+'home'; 
       }else { 
        $scope.error = response.message; 
        $scope.user = {}; 
       } 
      }); 
     } 
    }); 
});

個

問題：

的angularjs的cookies文件不會被加載了由於這我得到未知的提供程序錯誤。當我檢查元素時，我可以看到angularjs和角度路由js文件加載但不是angularjs cookie文件。對於angular-cookies，shim選項中的設置是否有誤？
如何加載服務和指令？我的services.js文件位於services文件夾內。我是通過在require中調用它來正確加載它嗎？我可以在require.config的paths選項中加載services.js文件嗎？
我在這裏閱讀了一些帖子，但沒有清楚地理解如何使用requirejs來加載模塊化文件。例如，我有不同的模塊，如登錄，管理，註冊等。我如何使用requirejs加載單個模塊js文件。下面是我的根文件夾結構

My App root directory structure

我將不勝感激，如果任何人都可以使用代碼解釋我。如果你需要任何其他細節，請讓我知道併爲這麼長的帖子感到抱歉。在簡短的

無法解釋

來源

2014-03-04 VishwaKumar

angularjs的cookies文件沒有加載：你必須要求它從某個地方（或require.config()使用deps配置選項）。爲它提供墊片不是自動需要它。
正在加載services.js as define([...,'services/services'],...)好像還行。它沒有加載？你有其他問題嗎？

另一方面，paths配置是提供別名（可以這麼說）的手段。像shim，它不會自動加載的東西。

要加載單個模塊，您必須從某個地方加載它們。具有角，這可能導致尷尬的情形，如：

define(["module1","module2","module3",...,"module1024"], function() { 
    // do nothing but load all the modules 
});

我想自己AngularJS + RequireJS +優化相結合（見angular-require-lazy和require-lazy）。角度需要懶惰的項目遠沒有完成，但它可能會給你一些想法。（我即將作出一些重大更改，現在就對付一些錯誤，但總的想法仍然存在。）

也作爲旁註：也許你應該暫停一下並熟悉Require，用一個小測試項目什麼的...

來源

2014-03-04 10:32:54

雅你的權利。首先需要閱讀requirejs。 – VishwaKumar

關於angularjs + requirejs的問題

回答

相關問題