Угловой UI-Router с компонентом не работает

У меня есть простой проект, который использует ui-router с компонентом. Для компонента «hello» ничего не произошло, если я нажал ссылку «hello»; если бы я нажал на ссылку «О программе», то он показал представление, потому что он не использует компонент. Может кто-то, пожалуйста, дайте мне знать, почему компонент «привет» не работает? Я пробовал другую версию angular-ui-router.js, но не исправил проблему. Благодарю.Угловой UI-Router с компонентом не работает

index.html:

<!DOCTYPE html> 
<html> 
<head> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular.js"></script> 
<!--<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.4.2/angular-ui-router.js"></script> --> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/1.0.0-rc.1/angular-ui-router.js"></script> 
<script src=https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/1.0.0-rc.1/angular-ui-router.min.js"> </script> 
<script src="js/hello-component.js"></script> 
<script src="js/hellogalaxy-module.js"></script> 

<style>.active { color: red; font-weight: bold; }</style> 
</head> 
<body ng-app="hellogalaxy"> 
    <a ui-sref="hello" ui-sref-active="active">Hello</a> 
    <a ui-sref="about" ui-sref-active="active">About</a> 
<ui-view></ui-view> 
</body> 
</html>

hellogalaxy-module.js:

var myApp = angular.module('hellogalaxy', ['ui.router']); 
myApp.config(function($stateProvider) { 
var helloState = { 
     name: 'hello', 
     url: '/hello', 
     component: 'hello' 
}; 

var aboutState = { 
     name: 'about', 
     url: '/about', 
     template: '<h3>Its the UI-Router hello world app!</h3>' 
} 
$stateProvider.state(helloState); 
$stateProvider.state(aboutState); 
});

HELLO-component.js:

angular.module('hellogalaxy').component('hello', 
{ 
    template: '<h3>{{$ctrl.greeting}} Solar System!</h3>'    
    controller: function() { this.greeting = 'hello'} 
})

источник

2017-02-22 jlp

Yo u должен сначала загрузить модуль, а затем компонент, изменить порядок как,

<script src="js/hellogalaxy-module.js"></script> 
<script src="js/hello-component.js"></script>

источник

2017-02-22 19:26:06 Sajeetharan

Спасибо! Это решило проблему. – jlp

Отметьте как ответ, если он помог – Sajeetharan

Я пытался, и он сказал, что могу принять ответ за xx минут. – jlp

Угловой UI-Router с компонентом не работает

ответ

Смежные вопросы