HTML not being parsed to view - angular.js

Question

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

$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?

EDIT 1

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

EDIT 2

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

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

EDIT 3 Fix:

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

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

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 .