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

I have this code:

我有这个代码:

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'
            }
        }
    });
});

If I change it to:

如果我将其更改为:

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'
            }
        }
    });
});

And I do

我做到了

$state.go("member");

It works ok. Loads the html and parse it to the main view, but with the first version and doing

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

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

It does not parse the html to the main view. It does load the html (I can see it at the debugger) but the html is not placed at the view. What am I doing wrong?

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

EDIT 1

I found this but this is not really helpful, because I'm doing it programmatically, not with html :(

我找到了这个,但这不是很有用,因为我是以编程方式进行的,而不是使用html :(

EDIT 2

Fiddle not working: http://jsfiddle.net/8ET4L/

小提琴不工作:http://jsfiddle.net/8ET4L/

Fiddle working: http://jsfiddle.net/FFx95/

小提琴工作:http://jsfiddle.net/FFx95/

EDIT 3 Fix:

编辑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'
            }
        }
    });
});

1 个解决方案

#1

As documentation 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/>".

记住:抽象状态仍然需要他们自己的让他们的孩子插入。因此,如果您使用抽象状态只是为了添加url,设置resolve / data,或运行onEnter / Exit函数,那么您还需要设置模板:“ ”。

Which means you have to have:

这意味着你必须:

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

in your fiddle. See my updated example.

在你的小提琴。请参阅我更新的示例。

Alternatively you can declare it on the state definition:

或者,您可以在状态定义上声明它:

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

See another fiddle.

看另一个小提琴。

#1