使用 Angular UI-Router 在 Ionic 框架中将状态作为新路由处理 [英] Handle State as new Route in Ionic Framework with Angular UI-Router

问题描述

我正在使用 Ionic 框架及其 AngularJS UI-Router 和 $stateProvider 来处理我的应用程序中的不同视图.

I'm using the Ionic Framework with its AngularJS UI-Router and $stateProvider to handle different views in my app.

但是，我无法弄清楚如何告诉 $stateProvider 我有不同的主视图"，每个视图都有不同的子视图.

However, I'm having trouble figuring out how to tell the $stateProvider that I got different "Main View's", with each having different Subviews.

例如，当我在 /#/home 上时，单击将我发送到 /#/about 的链接，然后单击 /#/about 不会像它自己的新视图那样呈现.相反，它过渡到它，因为它是 /#/home 的子页面.

When I'm on /#/home for example, and click on a link which sends me to /#/about, then /#/about doesn't get rendered as it's own, new view. Instead it transitions to it as it were a subpage of /#/home.

当我用 AngularJS $routeProvider 替换 $stateProvider 时，它的工作原理应该是这样，但随后所有的转换都消失了.

It works like it should when I replace $stateProvider with the AngularJS $routeProvider, but then all the transitions are gone.

我已经创建了一个 Pen 供您查看.

I've created a Pen for you to take a look at it.

http://codepen.io/anon/pen/gBDFi

它们之间不应该有过渡.每个基本"网址都应该是一个新的标签".

There should be no transition between them. Every "base" url should be a new "tab".

推荐答案

$StateRouteProvider 和 $UrlRouteProvider 的区别..

Difference between $StateRouteProvider and $UrlRouteProvider ..

$UrlRouteProvider.otherwise(url);-->路由到给定的网址.

$UrlRouteProvider.otherwise(url); -->route to given url.

$StateRouteProvider.otherwise(state);--> 路由到给定状态.

$StateRouteProvider.otherwise(state); -->route to given state.

因此，如果您正在使用 ui-router，那么无论何时需要更改视图，请使用 $state.go().在 $location.path(URL) 的情况下，将适用于从独立状态到当前状态的转换.如果您希望通过同一父级下的州进行路由，则必须使用 $state 路由.

So, if you are using ui-router then wherever view change is required use $state.go(). In a case of $location.path(URL) will work in a case like the transition to the independent state to current state. If you are looking to route through states under the same parent then you have to use $state route.

这篇关于使用 Angular UI-Router 在 Ionic 框架中将状态作为新路由处理的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！