無法加載具有組件的角度ui路由器的路由

Question

嗨，我是ui路由器的新手，目前正在學習它。我試圖路由到組件，但無法這樣做。

JS文件：

var app = angular 
.module('uiRouterDemoApp', ['ui.router']); 

function HelloComponentFunction() { 
var controller = this; 
controller.greeting = 'Hello'; 
controller.toggleGreeting = function() { 
controller.greeting = (controller.greeting === 'Hello') ? 'whats up' : 'hello'; 
}; 
} 

app.component('hello', { 
templateUrl: '/views/hello.html', 
controller: HelloComponentFunction 
}); 


app.config(function($stateProvider){ 
var helloGalaxy = { 
name: 'hello', 
url: '/hello', 
component: 'hello' 
}; 

var aboutState = { 
name: 'about', 
url: '/about', 
template: '<h4>Its the UI-Router hello World app!</h4>' 
}; 

$stateProvider.state(helloGalaxy); 
$stateProvider.state(aboutState); 

}); 

查看

<div class="container"> 
    <ul class=" list list-inline"> 
    <li><a ui-sref="hello" ui-sref-active="activelink">Hello</a></li> 
    <li><a ui-sref="about" ui-sref-active="activelink">About</a></li> 
    </ul> 
</div> 

當在視圖招呼URL的鏈接點擊不顯示視圖。請告訴我做錯了什麼。

Answer 1

試試這個

 $stateProvider 
      .state('hello', { 
       url: '/hello', 
       template: '<hello></hello>' 
      }) 
      .state('about', { 
       url: '/about', 
       template: '<about></about>' 
      })