问使用Angular UI路由器渲染组件

EN

angular.module('app.nameDisplay', [uiRouter])
.component('nameDisplay', {
    controller: function(){
        this.name = "Keir Beckett";
        this.age = 24;
        this.changeInfo = function(){
            this.name = "Golash Bista";
            this.age = 66;
        }
    },
    template: "" +
        "<div>" +
            "<h2>{{$ctrl.name}}</h2>" +
            "<h4>{{$ctrl.age}}</h4>" +
            "<button ng-click='$ctrl.changeInfo()'>Change Info</button>" +
        "</div>"
}).config(($stateProvider, $urlRouterProvider) => {
    $stateProvider.state('nameDisplay', {
        url: '/nameDisplay',
        component: 'nameDisplay'
    })
    .state("otherDisplay", {
        url: '/otherDisplay',
        template: '<h1>Other Display</h1>'
    });
    $urlRouterProvider.otherwise('/');
})
.name;