您的位置：首页 > Web前端 > AngularJS

AngularJs+RequireJs+angularAMD快速搭建项目步骤

2018-01-09 21:19 645 查看

步骤一

在main.js中定义模块和依赖：

require.config({
baseUrl: "js",
paths: {
'angular': '.../angular.min',
'angular-route': '.../angular-route.min',
'angularAMD': '.../angularAMD.min'
},
shim: { 'angularAMD': ['angular'], 'angular-route': ['angular'] },
deps: ['app']
});


在index.html中加载且仅加载require.js:

<head>
<script data-main="js/main.js" src=".../require.js"></script>
</head>


步骤二

用requirejs的define语句创建app.js

define(['angularAMD', 'angular-route'], function (angularAMD) {
var app = angular.module("webapp", ['ngRoute']);
app.config(function ($routeProvider) {
$routeProvider.when("/home", angularAMD.route({
templateUrl: 'views/home.html', controller: 'HomeCtrl',
controllerUrl: 'ctrl/home'
}))
});
return angularAMD.bootstrap(app);
});


步骤三

用app.register方法创建controller:

define(['app'], function (app) {
app.controller('HomeCtrl', function ($scope) {
$scope.message = "Message from HomeCtrl";
});
});
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签：  angularjs requirejs angularAMD
相关文章推荐
新的分享
章节导航