Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
1.0k views
in Technique[技术] by (71.8m points)

angular ui - angularjs ui-router default child state and ui-sref

I have the following states in my ui-router state provider:

$urlRouterProvider.when('/parent', '/parent/child');
$stateProvider.state('parent', {
     url: "/parent",
     abstract: true
});

$stateProvider.state('parent.child', {
     url: "/child"
});

Which follows the best practice for having a default child state as explained here in the ui-router docs.

However, when I now include a link in my document somewhere referencing parent with ui-sref such as <a ui-sref="parent">Link</a> I always get an error saying I cannot transition to an abstract state. When I enter the URL manually into the address bar and hit enter everything works fine.

Related Plunker: http://plnkr.co/edit/d3Z0tOwC3VCTPqGiB0df?p=preview

How can I combine ui-sref with default child states?

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

abstract states can not be targeted directly. They mainly serve as a foundation to build child states on. The only reason it works fine with the URL is that the /parent gets caught by the .when

That means when you invoke a child using

<a ui-sref="parent.child">

the child inside the parent gets loaded, meaning the parent will be loaded as the layer around it.

So, never target an abstract state itself. It's like having a door inside a door frame. You can only open and interact with the door (child), but never with the frame (parent) directly. However, when you interact with the door, the door and the frame are part of a system that gets loaded.

You can give the child an empty URL, so that it doesn't append anything to the parent state URL and will then be loaded.

See here for more info: https://github.com/angular-ui/ui-router/wiki/Nested-States-%26-Nested-Views#abstract-states


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...