zoukankan      html  css  js  c++  java
  • angularjs 路由

    使用angularjs 提供的 when 和 otherwise 两个方法来定义路由

    用 config 方法在特定的模块中定义路由

    eg : 

    angular.module("app", [])
    .config(["$routeProvider", function($routeProvider) {
    $routeProvider
    .when("/", {
    templateUrl:"views/home.html",
    controller:"homeController"        
    })    
    }])

     when 中的第一个对象,是路由路径, 与$location.path进行匹配, $location.path 是当前 url 的路径。

     when 中的第二个参数是配置对象,决定了第一个参数能匹配时,具体做些什么。配置对象中可以设置: controller 、 template 、 templateURL 、 resolve 、 redirectTo 和 reloadOnSearch

     controller : 设置控制器,将这个指定的控制器与路由所创建的新作用域关联在一起。如果 controller 中参数是字符型,会在模块中所有注册过的控制器中查找对应的内容,然后与路由器关联在一起。

          如果 controller 中的参数是函数的类型,这个函数会作为模板中DOM元素的控制器,并与模板进行关联。

    1. template

      eg: template: '<div><h2>Route</h2></div>'

      angularjs 会将 template 中的 html 模板渲染到对应的 具有 ng-view 指令的 DOM 元素中。

    2. templateUrl : 

      eg : templateUrl: 'views/template_name.html'

      应用会根据 templateUrl 属性所指定的路径来读取视图。如果能够找到并且读取这个模板,angularjs 会将模板的内容渲染到具有 ng-view 指令的 DOM 元素中。

    3. resolve  

      resolve : {

        'data' : ['$http',function($http){

          return $http.get('/api').then(  

            function success(resp) { return response.data; }

            function error(reason) { return false; }

          )

        }]

      }

     如果设置了 resolve 属性,angularjs  会将列表中的元素都注入到控制器中。 如果这些依赖是 promise 对象,它们在控制器加载以及  $routeChangeSuccess 被触发前 ,会被 resolve 并设置成一个值。

    列表对象可以是:
     键,键值是会被注入到控制器中的依赖的名字;
     工厂,即可以是一个服务的名字,也可以是一个返回值,它是会被注入到控制器中的函数或可以被resolve的promise对象。

    4. redirectTo 

    redirectTo: '/home'

    如果 redirectTo 属性的值是一个字符串,那么路径会被替换成这个值,并根据这个目标路径触发路由变化。


    // 或者
    redirectTo: function(route,path,search)

    如果 redirectTo 属性的值是一个函数,那么路径会被替换成函数的返回值,并根据这个目标路径触发路由变化。

    如果 redirectTo 属性的值是一个函数,AngularJS会在调用它时传入下面三个参数中:
    (1) route:从当前路径中提取出的路由参数;
    (2) path: 当前路径;
    (3) search: 当前URL中的查询串。

    5. reloadOnSearch

    如果 reloadOnSearch 选项被设置为 true (默认),当 $location.search() 发生变化时会重新加载路由。

    如果设置为 false ,那么当URL中的查询串部分发生变化时就不会重新加载路由。这个小窍门对路由嵌套和原地分页等需求非常有用。

  • 相关阅读:
    Mina、Netty、Twisted一起学(七):公布/订阅(Publish/Subscribe)
    MySQL高可用之——keepalived+互为主从
    JS之BOM
    Mac下利用(xcode)安装git
    计算矩阵边缘元素之和
    什么是猴子补丁(monkey patch)
    协议支撑
    BZOJ 3727 PA2014 Final Zadanie 树形DP
    Linux cat命令
    iOS8新特性
  • 原文地址:https://www.cnblogs.com/debra/p/6564597.html
Copyright © 2011-2022 走看看