[英]Angular UI-Router cannot resolve child state (with dynamic URL param) from its parent state
I have a parent state with data that I would like to use for making child states with dynamic URL params. 我有一个父状态,该数据要用于通过动态URL参数创建子状态。 Currently, I am getting this error, " Error: Could not resolve 'authors/view/Baxter Richard' from state 'dash/authors' ".
当前,我收到此错误,“ 错误:无法从状态'dash / authors'解析'authors / view / Baxter Richard' ”。
In my router.js file: 在我的router.js文件中:
.state('dashboard', {
url: "/auth/dashboard",
templateUrl: 'angular/dashboard.html',
controller: 'DashboardController',
resolve: {
user : function(UserService) {
return UserService.get();
},
user_drive : function(UserDriveService) {
return UserDriveService.get();
}
}
})
.state('dash/authors', {
parent: 'dashboard',
url: "/authors",
templateUrl: 'angular/partials/dash.authors.html'
})
.state('authors/create', {
parent: 'dash/authors',
url: "/create",
templateUrl: 'angular/partials/dash.authors.create.html'
})
.state('authors/view', {
parent: 'dash/authors',
url: "/:title",
templateUrl: 'angular/partials/dash.author-view.html'
})
.state('dash/epubs', {
parent: 'dashboard',
url: "/epubs",
templateUrl: 'angular/partials/dash.epubs.html'
});
$urlRouterProvider.otherwise('/');
$locationProvider.html5Mode(true).hashPrefix('!');
And in my dashboard_controller.js file: 在我的dashboard_controller.js文件中:
angular.module("app").controller("DashboardController", function($scope, $location, $http, user, user_drive) {
$scope.user = user.data;
$scope.user_drive = user_drive.data;
});
And in my dash.authors.html partial: 在我的dash.authors.html部分中:
<div class="col-sm-3" ng-repeat="author in user_drive.authors | orderBy:'title'">
<a ui-sref="authors/{{author.title}}">
<div ng-repeat="img in user_drive.author_imgs | filter: { parent_id: author.id }">
<img src="{{ img.img_src }}" alt="{{author.title}}" style="height:50px; border: 1px solid black;">
</div>
</a>
<div>
So, when I click on the anchor tag with the ui-sref of "authors/{{author.title}}", I get that error. 因此,当我用ui-sref为“ authors / {{author.title}}”的锚点标签单击时,出现该错误。
I ended up renaming my states using the dot-style syntax. 我最终使用点样式语法来重命名状态。 AFAIK, the problem was that I wasn't actually prepending the child state name with its exact parent state name (eg: 'dashboard' and 'dashboard.author') because I thought I just had to set the parent property inside the state (eg: "parent: 'dashboard',") and just name the child state whatever I wanted.
AFAIK,问题在于我实际上并未在子状态名称前加上其确切的父状态名称(例如:“ dashboard”和“ dashboard.author”),因为我以为我只需要在状态内设置父属性(例如:“父母:'仪表板'”),然后随便给孩子的州命名。
I'm not sure whether you understand the concept of states in angular-ui-router. 我不确定您是否了解angular-ui-router中的状态概念。 I suggest you thoroughly read the docs first.
我建议您先仔细阅读文档。 The state name is not the same as the state url.
状态名称与状态url不同。 The correct usage would be for example:
正确用法例如:
<a ui-sref="authors/view({title:author.title})">...</a>
It passes the author.title
variable to the state as title
, meaning it replaces :title
in the url. 它将
author.title
变量作为title
传递给状态,这意味着它将替换url中的:title
。 I also recommend not using slashes in the state name, as it seems very confusing. 我还建议不要在状态名称中使用斜杠,因为这似乎很令人困惑。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.