ui 路由器正在路由但不呈现 templateUrl

Question

我这样使用 UI-路由器 :

angular.module('app.user.awardee', [
    'ui.router'
])
    .config(
    [          '$stateProvider', '$urlRouterProvider',
        function ($stateProvider,   $urlRouterProvider) {
            $stateProvider
                .state('awardees', {

                    abstract: true,
                    url: '/u/awardee',

                    templateUrl: 'app/user/awardee/awardee.html',

                    resolve: {
                        awardees: ['awardees',
                            function( awardees){
                                return awardees.all();
                            }]
                    },


                    controller: ['$scope', '$state', 'users', 'utils',
                        function (  $scope,   $state,   users,   utils) {

                        }]
                })
                .state('awardees.personaldata', {
                    url: "/personaldata",
                    templateUrl: 'app/user/awardee/personal_info/personal/view.html',
                    controller: ['$scope', '$stateParams', '$state', 'utils', 'access',
                        function ($scope, $stateParams, $state, utils, access) {

                        }]
                })
                .state('awardees.personaldata.edit', {
                    url: "/edit",
                    templateUrl: 'app/user/awardee/personal_info/personal/edit.html',
                    controller: ['$scope', '$stateParams', '$state', 'utils', 'access',
                        function ($scope, $stateParams, $state, utils, access) {

                        }]
                })
                .state('awardees.univerisitydata', {
                    url: "/universitydata",
                    templateUrl: 'app/user/awardee/personal_info/university/view.html',
                    controller: ['$scope', '$stateParams', '$state', 'utils', 'access',
                        function ($scope, $stateParams, $state, utils, access) {

                        }]
                })
                .state('awardees.universitydata.edit', {
                    url: "/edit",
                    templateUrl: 'app/user/awardee/personal_info/university/edit.html',
                    controller: ['$scope', '$stateParams', '$state', 'utils', 'access',
                        function ($scope, $stateParams, $state, utils, access) {

                        }]
                })
                .state('awardees.bank', {
                    url: "/bank",
                    templateUrl: 'app/user/awardee/personal_info/bank/view.html',
                    controller: ['$scope', '$stateParams', '$state', 'utils', 'access',
                        function ($scope, $stateParams, $state, utils, access) {

                        }]
                })
                .state('awardees.bank.edit', {
                    url: "/edit",
                    templateUrl: 'app/user/awardee/personal_info/bank/edit.html',
                    controller: ['$scope', '$stateParams', '$state', 'utils', 'access',
                        function ($scope, $stateParams, $state, utils, access) {

                        }]
                })

        }
    ]
);

我从 'awardees.personaldata' 到 'awardees.personaldata.edit'，路线发生了，url 已更改但它不呈现 'awardees.personaldata.edit'，它呈现 'awardees.personaldata'。控制台没有错误，什么是我的假？以及如何让它发挥作用？

我使用此代码进行转换：

<a ui-sref="awardees.personaldata.edit" class="btn btn-hollow btn-primary btn-sm">Edit Personal Data</a>

Answer 1

我敢猜测，这很可能与 ui-view.

缺失有关

父状态的视图，在这种情况下，"awardees.personaldata" 必须在某处为子状态 - "awardees.personaldata.edit" - 呈现其内容（就像 "awardees" 状态的视图有其 ui-view，我认为它确实如此，因为您可以查看 "awardees.personaldata").

因此，请确保在模板中：'app/user/awardee/personal_info/personal/view.html' 你有类似的东西：

<div>
  <span>Some data from "awardees.personaldata" state</span>

  <!-- space to render "awardees.personaldata.edit" state -->
  <div ui-view></div>
</div>

ui 路由器正在路由但不呈现 templateUrl

ui router is routing but not render the templateUrl

angularjs

angular-ui-router