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

      闲来无事,写一写我们常用的angular中的路由,angular中路由是既简单有好用一种页面切换方式,对于angular而言他有自己的路由模块--ngRoute,

      首先需要我们引入,angular.js与angular.route.js,然后配置HTML中的代码,(省略)

      下面是js文件中需要写入的代码

      以下代码可以直接拿来使用 只需要修改一些参数

    <script type="text/javascript">

    var app = angular.module("myApp",["ngRoute"]);

    app.controller("ctr",function(){

     

    });

    //angular 1.6.0以上版本需要配置  

    //此处需要注意,如果不写此行代码 会显示错误

    app.config(["$locationProvider",function($locationProvider){

    $locationProvider.hashPrefix("");

    }]);

    //配置路由信息

    app.config(function($routeProvider){

    $routeProvider.when("/aaa",{templateUrl:"a.html"});

    $routeProvider.when("/bbb",{templateUrl:"b.html"});

    $routeProvider.when("/ccc",{templateUrl:"c.html"});

    $routeProvider.otherwise({templateUrl:"a.html"});

    });

    </script>

     

    以上便可以实现简单的路由功能,那么问题来了,此种路由不能进行嵌套,什么意思呢?意思为:在我们的项目中,已经使用了ngRoute路由功能实现页面的跳转切换,那么如果在切换后的页面中嵌套路由功能,ngRoute是无法实现的,此时需要我们引入第三方路由模块,叫做ui.router模块.

    UI,router有两个好处,

    多视图 嵌套视图

    有了ui.router就可以实现多层嵌套路由了

  • 相关阅读:
    UVA 11019 Matrix Matcher ( 二维字符串匹配, AC自动机 || 二维Hash )
    蓝桥杯 修改数组 (巧用并查集)
    luoguP3242 [HNOI2015]接水果
    CF757F Team Rocket Rises Again
    luoguP2597 [ZJOI2012]灾难
    luoguP4103 [HEOI2014]大工程
    luoguP3233 [HNOI2014]世界树
    luoguP2495 [SDOI2011]消耗战
    CF613D Kingdom and its Cities
    51nod 1584 加权约数和
  • 原文地址:https://www.cnblogs.com/sunweinan/p/ngRoute.html
Copyright © 2011-2022 走看看