requirejs 配置文件
require.config({
baseUrl:'.',paths:{
'jquery': 'vender/jquery/jquery',
'bootstrap': 'vender/bootstrap/bootstrap',
'angular' : 'vender/angularjs/angular',
'route':'vender/angular-route/angular-route',
'domReady':'vender/domReady'
},
shim:{
'bootstrap':{
deps:['jquery']
},
"route":{
deps:['angular']
}
}
});
require(['domReady','angular','js/app','jquery'],function (domReady) {
// 启动angular
domReady(function(){
angular.bootstrap(document,['App']);
})
})
angularjs 配置文件
define(['angular',"route"],function(){
'use strict';
// 定义app模块
var appModule = angular.module('App', ['ngRoute']);
// app模块配置
appModule.config(['$routeProvider','$locationProvider',
function($routeProvider,$locationProvider) {
$locationProvider.html5Mode(false).hashPrefix('~');
$routeProvider
.when(
"/view1",
{
templateUrl : "./js/view/view1.html",
reloadOnSearch : false
}
)
.when(
"/view2",
{
templateUrl : "./js/view/view2.html",
reloadOnSearch : false
}
)
.otherwise({
redirectTo : "/index"
});
}]);
});
index.html
<!DOCTYPE html>
<html>
<head>
<title>Hello Mars</title>
<link rel="stylesheet" type="text/css" href="css/main.css">
</head>
<body>
<div class="container">
<h3 ref="#~/view2" style="color:red">This is Mars</h3>
<a href="#~/index">index</a>
<a href="#~/view1">view1</a>
<a href="#~/view2">view2</a>
<div ng-view></div>
</div>
</body>
<script src="vender/requirejs/require.js" data-main="./js/config"></script>
</html>
2465
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
