javascript - HTML 未被解析以查看 - angular.js

Question

我有这个代码:

angular.module("App").config(function($stateProvider, $locationProvider, $injector) {
    $stateProvider
    .state("member", {
        url: "/member",
        abstract: true
    })
    .state("member.list", {
        url: "/list",
        views: {
            "" : {
                templateUrl: "/js/angular/partials/member/list.html?" + Math.random(),
                controller: 'MemberController'
            }
        }
    });
});

如果我将其更改为:

angular.module("App").config(function($stateProvider, $locationProvider, $injector) {
    $stateProvider
    .state("member", {
        url: "/member/list",
        views: {
            "" : {
                templateUrl: "/js/angular/partials/member/list.html?" + Math.random(),
                controller: 'MemberController'
            }
        }
    });
});

我愿意

$state.go("member");

工作正常。加载 html 并将其解析到主视图，但使用第一个版本并执行

$state.go("member.list");

它不会将 html 解析到主视图。它确实加载了 html(我可以在调试器中看到它)，但 html 没有放置在 View 中。我做错了什么？

编辑 1

我找到了this但这并没有多大帮助，因为我是以编程方式完成的，而不是使用 html :(

编辑2

fiddle 不工作: http://jsfiddle.net/8ET4L/

fiddle 工作: http://jsfiddle.net/FFx95/

编辑3 修复:

angular.module("App").config(function($stateProvider, $locationProvider, $injector) {
    $stateProvider
    .state("member", {
        url: "/member",
        abstract: true,
        template: "<div ui-view />"
    })
    .state("member.list", {
        url: "/list",
        views: {
            "" : {
                templateUrl: "/js/angular/partials/member/list.html?" + Math.random(),
                controller: 'MemberController'
            }
        }
    });
});

Answer 1

作为文档 says :

Remember: Abstract states still need their own <ui-view/> for their children to plug into. So if you are using an abstract state just to prepend a url, set resolves/data, or run an onEnter/Exit function, then you'll additionally need to set template: "<ui-view/>".

这意味着您必须拥有:

<div ng-app="App" ng-controller="AppCtrl">
    <div ui-view>
       <div ui-view>
        this is the main view
       </div>
    </div>
</div>

在你的 fiddle 中。看我的updated example .

或者，您可以在状态定义中声明它:

.state("member", {
    url: "/member",
    abstract: true,
    template: "<div ui-view/>"
})

参见another fiddle .