1、H5頁面,引入 requireJS和其配置文件;同時使用 angularJS的模塊
2、requireJS 定義加載路徑(可以加載樣式和js文件),在這里加載angularJS 和 自定義的組件
main.js
require.config({
//定義基礎路徑,其他的path等路徑是基于基礎路徑進行引入的。如果不配置,默認為引入requireJS頁面所在的位置
//baseUrl:"scripts/",
//requirejs默認對文件進行js擴展名處理,如果加上js或者以http、https開頭,則不處理
paths:{
//定義組件名稱,以及組件js所在的路徑
"angular":"./angular",
"use":"./use"
},
//
shim:{
"angular":{
exports: "angular"
}
}
});
require(["angular","app"],function(angular,app){
//angularjs 啟動
angular.bootstrap(document,['TestAll']);
});
3、實現 angularJS 組件化的 控件或服務
use.js
define(["angular"],function(angular){
var app=angular.module("use",[]);
app.service('myService', ['$rootScope', function($rootScope) {
this.value="use";
}]);
});
4、應用二次開發 angularJS的代碼,引入組件
app.js
define(["angular","use"],function(angular){
var app=angular.module("TestAll",["use"]);
app.controller('ctrlLogin',['$scope','myService',function($scope, myService){
$scope.name="ketty" + myService.value;
}]);
});