zoukankan      html  css  js  c++  java
  • vue-router 路由与 angular-route

    一些相同的地方和不一样的地方,更好的理解两个路由!

    在angular-route:

    *$rootScope 注册的根作用域,所有的控制器都可以用。

    问题1:angualr-routel 里点击对应的路由路径会执行两次,为什么?

    app.controller("postNewsController",function ($scope,$rootScope) {
            $rootScope.message="elin";
            console.log($rootScope.message);
                })
    app.controller("readNewsController",function ($scope,$rootScope) {
    console.log($rootScope.message);//执行两次
    })
    app.config(function ($routeProvider,$locationProvider) {
    $locationProvider.hashPrefix("");
    $routeProvider.when("/home",
    {

    template:"<p>home</p>",
                controller:"postNewsController"
            });
    $routeProvider.when("/find",
    {
    template:"<p>find</p>",//在页面点击它时,会执行两次
    readNewsController控制器里的事件
                controller:"readNewsController"
    })
    $routeProvider.otherwise("/find");
    });
     

     vue-router

    var router=new VueRouter(
            {
                routes:[
                    {path:"/home",component:{template:"<p class='home'>home</p>"}},
                    {path:"/find",component:{template:"<p>find</p>"}}
                ]
            }
        )
        var config={
           el:"#app",
            data:{},
            router:router
        }
    new Vue(config);

    angular-route:  特别注意有没有r     angular 的 ng-Route  与 vue的 router  但是 angular的第三方路由 ui-router

     var app=angular.module("app",["ngRoute"]);
        app.controller("home",function ($scope) {
            $scope.name="sekin";
        })
        app.controller("find",function ($scope) {
            $scope.name="12";
        })
    app.config(function ($routeProvider,$locationProvider) {
        $locationProvider.hashPrefix("");//用来解决angular1.46 -> 1.63 版本跳转路径的时候,hash出现错误,$locationProcider 通过hashPrefix 去掉多余的部分
        $routeProvider.when("/home",{
            template:"<p ng-bind='name'></p>",
            controller:"home"  
        })
        $routeProvider.when("/find",{
            template:"<p ng-bind='name'></p>",
            controller:"find"
        })
    }
    )
            angular 里 app.js 文件 : angular.module("app",["app.route"]);
    到另外一个文件里引用 route.js : var app= angular.module("app.route",["ngRoute"])
  • 相关阅读:
    Codeforces Round #229
    A Funny Game(博弈论)
    01背包模板
    一月24日新生冬季练习赛解题报告H.排列问题
    一月24日新生冬季练习赛解题报告F.棋盘
    POJ 2240Arbitrage
    POJ 3660Cow Contest
    POJ 3259Wormholes
    POJ 1860Currency Exchange
    HDU 4027Can you answer these queries?
  • 原文地址:https://www.cnblogs.com/S-Ekin/p/6596283.html
Copyright © 2011-2022 走看看