私は2つのコントローラheaderController、aboutControllerを持っています。最初に実行する別のコントローラに値を渡す
headerController - >作品を約-たちページのロード - >ナビゲーションとリダイレクト
aboutControllerを維持するために。
aboutControllerが読み込まれるときにheaderController変数の値を更新する必要があります。すなわち、私たちのページが読み込まれると、すべてのページと同様にabout-usのナビゲーションがアクティブになります。
これは私のコードです:
app.service('shareService', function() {
var data;
return {
getProperty: function() {
return data;
},
setProperty: function (value) {
data = value;
}
};
});
app.controller('headerController', function ($scope, shareService) {
$scope.navigation = [
{url: '#!/home', name: 'Home'},
{url: '#!/about-us', name: 'About Us'},
{url: '#!/services', name: 'Services'}
];
var data = shareService.getProperty();
console.log(data);
$scope.selectedIndex = 0;
$scope.itemClicked = function ($index) {
console.log($index);
$scope.selectedIndex = $index;
};
});
app.controller('aboutController', function ($scope, shareService) {
console.log('test');
$scope.selectedIndex = 1;
shareService.setProperty({navigation: $scope.selectedIndex});
});
はheader.html:
<header ng-controller="headerController">
<div class="header">
<div class="first-half col-md-6">
<div class="row">
<div class="logo">
<a href="#!/home"><img src="assets/img/logo.png" alt=""/></a>
</div>
</div>
</div>
<div class="second-half col-md-6">
<div class="row">
<div class="social-share">
<ul id="social-share-header">
<li><i class="fa fa-facebook" aria-hidden="true"></i></li>
<li><i class="fa fa-twitter" aria-hidden="true"></i></li>
<li><i class="fa fa-google-plus" aria-hidden="true"></i></li>
</ul>
</div>
</div>
</div>
<nav>
<ul ng-repeat="nav in navigation">
<li class="main-nav" ng-class="{ 'active': $index == selectedIndex }"
ng-click="itemClicked($index)">
<a href="{{nav.url}}">{{nav.name}}</a>
</li>
</ul>
</nav>
</div>
</header>
index.htmlを これは私のテンプレートがどのように動作するかです。
<body ng-app="myApp">
<section class="first-section">
<div ng-include="'views/header.html'"></div>
</section>
<section class="second-section">
<div ng-view></div>
</section>
<section class="last-section">
<div ng-include="'views/footer.html'"></div>
</section>
</body>
更新1:index.htmlファイルを追加しました。
更新2:問題の説明:about usページに直接移動すると、まだホームナビゲーションが有効になります。しかし、それはすべきだAbout Us
'AboutController'によって更新され、' HeaderController'によって読み込まれるサービス内で変数を設定することができます。 – Weedoze
問題が何であるか分かりません。私はヘッダーコントローラは、DOMには常に含まれている別のテンプレートであるヘッダーのために存在すると思います。したがって、ユーザーがヘッダーからnav要素をクリックすると、itemClickedがトリガーされます。コントローラーが操作されても、ヘッダーコントローラーはまだ存在しますが、同じことが起こります。問題を指定してください。 – Korte
私の更新を確認してください – Jagadeesh