angular（路由）

一、自定义指令
1、transclude
2、controllerAs：给控制器起一个别名
3、link：在指令中操作DOM，需要用到该属性，其属性值为一个函数，称为链接函数
语法:
link:function(scope,element,attrs){
操作DOM
}
-scope：与指令想关联的当前作用域
-Element：当前指令对应的元素
-attrs：当前元素的属性所组成的对象
二、路由
1、概念
因为AngularJS主要是针对单页面应用，当我们需要页面的切换时，就需要用到路由
在AngularJS中使用ngRoute实现路由机制
2、ngRoute把包含的内容
-$routeProvider：用来定义路由表，也就是路由地址栏模板-$routeParams：保存地址栏中的参数，比如id
-$location：用来获取或设置地址栏的信息
-ng-view：用来在主视图中指定加载子视图的区域
3、实现路由机制
-引入AngularJS的路由js文件
-需要在模块中注入对ngRoute的依赖: var app = angular.module(‘app’,[ngRoute]);
-配置路由表
-可以设置的参数：controller/controllerAs 与自定义指令的用法一致

{controller1.name}}
',//通过别名，访问控制器的数据controllerAs:'controller1',//给controller属性的值取一个名字，以便于访问controller:function($scope){this.name = "张三";}}});app.directive('useLink',function(){return{restrict:'EA',controller:function($scope){$scope.stus = [{name:"张三",age:20,},{name:"李四",age:10},{name:"王五",age:19}];//如果需要使用别名访问控制器中的变量或方法，需要在控制器中用this声明this.fun = function(){alert('这是一个方法');}},controllerAs:'StuController',template:'
{{s.name+"-"+s.age}}
',link:function(scope,ele,attrs,StuController){ele.on('click',StuController.fun);//给元素绑定控制器中的fun函数}}}) -->第一个子页面第二个子页面第三个子页面第四个子页面   

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！