1.路由的配置：
在Angular.js中，我们可以根据自己的需求来配置路由，以达到当url中的地址改变时，会跳转不同的页面
<script>
//一开始的url:"http://mycc.com#/"
//第一步：创建模板
//数组里面的是该模板要依赖的模板，这边要依赖的是ngRoute模块
var app = angular.module('movie_list', ['ngRoute','myJsonpService'])
//第二步：配置路由规则
app.config(['$routeProvider',function($routeProvider) {
//当url变成:"http://mycc.com#/cc"时，执行when里面的函数
$routeProvider.when('/cc'，{
template:"这里面可以放一段具有html语义的字符串,如:<div>这是div标签</div>",
templateUrl:"这里面放的是html的路径,这个与template只能二选一",
controller:"控制器名称,如:routeController"
})；
}]);
//有需要的话可以创建一个控制器
//这边的数组里面需要什么就传入什么(但是传入的要是angular里提供的或者是创建的service里面的,譬如这边的MyService)
app.controller('routeController', ['$scope',"$location",'MyService', function($scope,$location,MyService){
$scope.name = 'cc';//这边设置的属性，在上面的template/templateUrl中可以直接使用
//可以直接使用MyService里面封装的函数,传入相关参数即可
MyService.jsonp();
}])
</script>
2.服务模块的配置
这个创建的服务可以在其他模块中使用
(function(angular){
// 1.创建模块
var app = angular.module('myJsonpService', [])
// 2.创建服务
app.service('MyService',['$window',function($window){
this.jsonp = function(url, arg, fn){
// 1.创建script标签
var scrip = $window.document.createElement('script')
// 2.设置src属性值
// 2.1 拼接url及arg
// arg {} ?a=b&c=22
var querystring = ''
for(var key in arg){
querystring += key+'='+ arg[key] +'&'
}
var funcName = 'myJsonp'+ $window.Math.random().toString().substr(2) // 0.232
url += '?' + querystring +'callback='+funcName
$window[funcName] = function(data){
fn(data)
}
scrip.src = url
// 3.把script标签添加到dom上去
$window.document.body.appendChild(scrip)
}
}])
})(angular)
3.自定义模块
使用自定义模块可以创建我们想要的模块，实现我们想要的功能
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>demo</title>
</head>
<body>
<div my-demo></div>
</body>
<script>
//一开始的url:"http://mycc.com#/"
//第一步：创建模板
//数组里面的是该模板要依赖的模板，这边要依赖的是ngRoute模块
var app = angular.module('demo', [])
//第二步：创建自定义指令
//参数一:指令的名称(注意的是命名规则)
//参数二:与创建控制器的第二个数组参数相类似
app.directive('myDemo', [function(){
//返回的是一个对象
return {
// name: '',
// priority: 1,
// terminal: true,
scope: {}, //传入的是一个对象，可以获取自定义指令的属性值
// controller: function($scope, $element, $attrs, $transclude) {},
// require: 'ngModel', // Array = multiple requires, ? = optional, ^ = check parent elements
restrict: 'A', // E = Element, A = Attribute, C = Class, M = Comment
template: '',//一个HTML字符串
templateUrl: '',//1.html文件的路径 2.script标签的id
replace: true,//布尔值，为true时，模板会被用来替换自定义指令所在的标签
transclude: true,//布尔值，为true时，将自定义标签中的内容插入到模板中拥有ng-transclude指令的标签中
// compile: function(tElement, tAttrs, function transclude(function(scope, cloneLinkingFn){ return function linking(scope, elm, attrs){}})),
link: function($scope, iElm, iAttrs, controller) {
//
}
};
}]);
</script>
</html>