0
角度&角度-ui-routerの1ページアプリケーションを設定するために、このチュートリアルhttps://ui-router.github.io/tutorial/ng1/hellosolarsystemを使って作業しています。私は早い段階でいくつかのエラーを抱えていましたが、それらを修正しました。今はエラーが全く出ませんが、ヘッダーを除いて何も表示されません。角度のないルータでエラーやコンテンツが表示されない
ナビゲーションリンクをクリックすることはできますが、予想されるコンテンツは表示されません。エラーもありません。私はナビゲーションリンクをユーザーがクリックすると、テンプレートを切り替えたい
<!DOCTYPE html>
<html>
<head>
<script src="ext-js/angular.min.js"></script>
<script src="ext-js/angular-ui-router.min.js"></script>
<script src="js/s.js"></script>
<script src="home_component.js"></script>
<style>.active { font-weight: bolder; }</style>
</head>
<body ng-app="CarSites">
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" ui-sref="Home" ui-sref-active="active">Car Suite</a>
</div>
<ul class="nav navbar-nav">
<li>
<a ui-sref="Mongo" ui-sref-active="active">Mongo</a>
</li>
</ul>
</div>
</nav>
<div id="main">
<ui-view></ui-view>
</div>
</body>
</html>
のindex.html：
は、ここに私のhtmlです。ここではjavascriptのだ：私はループに登録さに個別に登録されてから状態を変更した後
var myApp = angular.module('CarSites', ['ui.router']);
myApp.config(function($stateProvider) {
states = [
{
name: 'Home',
url: '',
component: 'home'
},{
name: 'Mongo',
url: '/Mongo',
template: '<h3>Mongo</h3>'
}];
// Loop over the state definitions and register them
states.forEach(function(state) {
$stateProvider.state(state);
});
});
s.jsは問題が始めたので、私はこの問題はそれとは何かを持っていると思います。
home_compenent.js：
ハローホーム：私は見ることが期待されるホーム・ページ上だから、
angular.module('CarSites').component('home', { template: '<h3>{{$ctrl.greeting}} Home!</h3>' + '<button ng-click="$ctrl.toggleGreeting()">toggle greeting</button>', controller: function() { this.greeting = 'hello'; this.toggleGreeting = function() { this.greeting = (this.greeting == 'hello') ? 'whats up' : 'hello' } } });！ （ボタン）
何も表示されていないため、エラーはありません。私は角のnoobだから私はこれは本当に簡単な問題だと思うが、私はコードを注いだと間違って表示されません。誰かが私の問題を見ていますか？