0
Ich habe zwei Controller headerController, aboutController.Übergeben Sie einen Wert an einen anderen Controller, der zuerst
headerController -> Um die Navigation und Umleitung
aboutController halten -> funktioniert, wenn über-uns Seite geladen wird.
Mein Problem ist ich muss den headerController Variablenwert aktualisieren, wenn aboutController geladen wird. Wenn bei uns die Seite geladen wird, sollte die Navigation über-uns aktiv sein, ähnlich wie bei allen Seiten.
Dies ist mein Code:
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 Dies ist, wie meine Vorlage funktioniert.
<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>
Update 1: Index.html-Datei hinzugefügt.
Update 2: Problem Erklärung: Wenn ich direkt auf die Über uns Seite gelaufen bin, dann ist immer noch die Home Navigation aktiv. Aber es sollte über uns sein
Sie können eine Variable in einem Service, der von 'AboutController' aktualisiert werden und von' HeaderController' – Weedoze
Ich kann immer noch nicht sehen, was das Problem ist. Ich nehme an, Header-Controller existiert für den Header, der eine separate Vorlage ist, die die ganze Zeit im DOM enthalten ist. Wenn der Benutzer also aus der Kopfzeile auf ein Navigationselement klickt, wird itemClicked ausgelöst. Dasselbe passiert auch, wenn der Controller manipuliert wird, der Header-Controller ist immer noch da. Können Sie bitte das Problem angeben? – Korte
Bitte überprüfen Sie meine Updates – Jagadeesh