博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
vue-router 路由与 angular-route
阅读量:5088 次
发布时间:2019-06-13

本文共 1911 字,大约阅读时间需要 6 分钟。

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

在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:"

home

",
controller:"postNewsController"
});     $routeProvider.when("/find",         {
template:"

find

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

 vue-router

var router=new VueRouter(        {            routes:[                {path:"/home",component:{template:"

home

"}}, {path:"/find",component:{template:"

find

"}} ] } ) 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:"

", controller:"home" }) $routeProvider.when("/find",{ template:"

", controller:"find" })} )
angular 里 app.js 文件 : angular.module("app",["app.route"]);         到另外一个文件里引用 route.js : var app= angular.module("app.route",["ngRoute"])

转载于:https://www.cnblogs.com/S-Ekin/p/6596283.html

你可能感兴趣的文章
Thrift Expected protocol id ffffff82 but got 0
查看>>
.NET下XML文件的读写
查看>>
2009程序员考试大纲
查看>>
Linq to XML
查看>>
[HDOJ3718]Similarity(KM算法,二分图最大匹配)
查看>>
a 标签中调用js的几种方法
查看>>
从SQL Server 2005 中 导入 导出 excel 表格
查看>>
R Shiny(开源的R包)
查看>>
用Tensorflow做蝴蝶检测
查看>>
Hbuilder编辑器 设置less即时编译环境
查看>>
【2.2】创建博客文章模型
查看>>
【3.1】Cookiecutter安装和使用
查看>>
【2.3】初始Django Shell
查看>>
Linux(Centos)之安装Redis及注意事项
查看>>
重构视角(摘抄)
查看>>
【H5 音乐播放实例】第一节 音乐详情页制作(1)
查看>>
listView注意的地方
查看>>
Filter案例
查看>>
装饰器与子类化
查看>>
学习笔记(六)——数据表的查找功能、数据行、数据列的综合应用
查看>>