在做ionic使用ui-router定义路由的时候遇到的奇葩问题

在定义路由的时候我这样子定义的时候是有问题的、购物车和个人是属于同一级 都是tab、然后第一次点击购物车的时候渲染的竟然是个人、而且还会选中个人tab、这问题不知道为毛会这样、先说一下个人是最后一个tab 、然后如果其他tab定义的url和最后一个tab的url前面有一样的话就会出现奇葩问题、我感觉第一个tab和其他也可能会有这个问题、//购物车.state(‘tab.cart‘, {  url: ‘/user-cart‘,  cache: false,  views: {    ‘tab-cart‘: {      templateUrl: ‘./templates/tabs/tab-cart.html‘,      controller: ‘CartCtrl‘    }  }})//个人.state(‘tab.user‘, {  url: ‘/user‘,  views: {    ‘tab-user‘: {      templateUrl: ‘./templates/tabs/tab-user.html‘,      controller: ‘UserController‘    }  }})

试了一下第一个tab不会有这问题、就是最后一个会有这种问题

时间： 2024-11-08 00:38:20

在做ionic使用ui-router定义路由的时候遇到的奇葩问题的相关文章

angular 的ui.router 定义不同的state 对应相同的url

Angular UI Router: Different states with same URL? The landing page of my app has two states: home-public, home-logged-in. Now I want to show both states on the same URL, but let the controller and template depend on the user session (is the user log

ngRoute 和 ui.router 的使用方法和区别

在单页面应用中要把各个分散的视图给组织起来是通过路由机制来实现的.本文主要对 AngularJS 原生的 ngRoute 路由模块和第三方路由模块 ui.router 的用法进行简单介绍,并做一个对比. ngRoute 使用方法 1) 引入 angular-route lib 无论是 ngRoute 还是 ui.router ,作为框架额外的附加功能,都必须以模块依赖的形式被引入. 1 <script src="lib/angular-route.js"></sc

Angularjs中UI Router用法小记录

今天自己参考已有的项目代码学习了下UI Router的用法,写了个小demo,验证了下自己的想法,现把使用情况记录一下. 1.入口文件index.html,引入项目所需的js文件,标注ng-app,创建ui-view元素,为后面的嵌套做容器准备. <!DOCTYPE html> <html lang="en" ng-app="myApp"> <head> <meta charset="UTF-8">

[转]AngularJS 使用 UI Router 实现表单向导

本文转自:http://www.oschina.net/translate/angularjs-multi-step-form-using-ui-router 今天我们将使用AngularJs和伟大的UI Router以及Angular ngAnimate module创建一个带动画的多步表单.这项技术可以用在你想要简化用户操作的大表单上. 我们看到这项技术已经应用在了许多的网页上.比如购物车,注册表单,入职流程以及许多多步表单,让用户更容易在线填写表单. 下面我们将构建它: 使用UI Rout

Angularjs中UI Router全攻略

摘自:Angularjs中UI Router全攻略温馨提示:想要了解 angular-ui-router的同学,从上往下读一遍,能带随着coding那就更好了,保证你对angular-ui-router基本全部掌握. 如何引用依赖angular-ui-router angular.module('app',["ui.router"]) .config(function($stateProvider){ $stateProvider.state(stateName, stateCofi

vue router动态路由

<div id="#app"> <router-link to="/user/header">路由1</router-link> /*指向user组件*/ <router-link to="/user/footer">路由2</router-link> /*指向user组件*/ /*当我们点击路由1得时候*/ /*------当我们点击路由2得时候*/ <router-view&g

vue 实例化定义路由

const Home = Vue.extend({ template: '', data: function() { return {} }, mounted () { } }) Vue.extend返回的是一个"扩展实例构造器",也就是预设了部分选项的Vue的实例构造器,它常常服务于Vue.component用来生成组件,可以简单理解为当在模板中遇到该组件作为标签的自定义元素时,会自动调用"扩展实例构造器"来生产组件实例,并挂在到自定义元素上 const rout

thinkPHP定义路由

URL地址里面的index模块怎么才能省略呢,默认的URL地址显得有点长,下面就来说说如何通过路由简化URL访问. 我们在路由定义文件(application/route.php)里面添加一些路由规则,如下: return [ // 添加路由规则路由到 index控制器的hello操作方法 'hello/:name' => 'index/index/hello', ]; 该路由规则表示所有hello开头的并且带参数的访问都会路由到index控制器的hello操作方法. 路由之前的URL访问地址

AngularJS之基础-5 路由(定义路由、使用路由)、自定义指令(Directive)

一.定义路由 ng-view - AngularJS 支持通过在单页面上的多个视图的单页应用 - ng-view 标记只是简单地创建一个占位符 - 使用 ng-template - 创建使用script标签的HTML视图 - 使用 - 定义类型作为主模块中 ng-template 的脚本块 $routeProvider - 映射相应的HTML页面或ng-template - 附加一个控制器使用相同键的服务 - 注意: - 需要angular-route.js脚本文件的引用二.使用路由锚点