Question

我有一个父状态，其中包含我想用于生成具有动态URL参数的子状态的数据。目前，我收到此错误，＆＃34; 错误：无法解析＆＃39; authors / view / Baxter Richard＆＃39;来自州＆＃39;破折号/作者＆＃39; ＆＃34;。

在我的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('!');

在我的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;

    });

在我的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>

所以，当我点击带有＆＃34; authors / {{author.title}}＆＃34;的ui-sref的锚标签时，我得到了这个错误。

Answer 1

我最终使用点式语法重命名我的状态。 AFAIK，问题是我实际上并没有在子状态名称前加上其确切的父状态名称（例如：＆＃39; dashboard＆＃39;和＆＃39; dashboard.author＆＃39;）因为我认为我只需要在州内设置父属性（例如：＆＃34; parent：＆＃39; dashboard＆＃39;，＆＃34;）并且只需将子状态命名为我想要的任何内容。

Answer 2

我不确定你是否理解angular-ui-router中的状态概念。我建议你先仔细阅读文档。状态名称与州URL不同。正确的用法是例如：

<a ui-sref="authors/view({title:author.title})">...</a>

它将author.title变量传递给title状态，这意味着它会替换网址中的:title。我还建议不要在州名中使用斜杠，因为它看起来很混乱。

Angular UI-Router无法从其父状态解析子状态（具有动态URL参数）

2 个答案: