角分量不會呈現模板

Question

我有這些國家在我的角度應用：

angular 
    .module('appRoutes', ["ui.router"]) 
    .config(['$stateProvider', '$urlRouterProvider', function($stateProvider, $urlRouterProvider) { 

    // An array of state definitions 
    var states = [ 
     { name: 'home', url: '/', component: 'home' }, 
     { name: 'about', url: '/about', component: 'about' }, 

    ] 

    // Loop over the state definitions and register them 
    states.forEach(function(state) { 
     console.log(state.component) 
     $stateProvider.state(state); 
    }); 

    $urlRouterProvider.otherwise('/'); 
}]); 

這裏是我的其他文件中包含模塊聲明：

'use strict'; 

var talentforceApp = angular.module("talentforce", []); 

angular 
    .module('TalentForce_Application', [ 
     'appRoutes', 
     'talentforce', 
     'ngResource' 
    ]); 

以及其中一個簡單組件的文件：

talentforceApp.component('about', { 
    template: '<h3>About TalentForce</h3>' 
}) 

當我運行它時，我的控制檯沒有提供任何錯誤。我檢查了，狀態和組件確實保存了。它只是不渲染。當我點擊我應用程序的About按鈕時，沒有模板，只是空白，沒有錯誤。由於沒有錯誤，因此很難調試。我在這裏錯過了什麼？

Answer 1

angular.module('appRoutes').component('about', { 
    template: '<h3>Template</h3>' 
})