zeigen nur bestimmte Registerkarten auf der Seite an AngularJS

Ich möchte eine gemeinsame index.html-Seite haben, auf der Links zu allen Vorlagen-Htmls und Menü-Tabs stehen. Ich möchte nur bestimmte Registerkarten anzeigen, abhängig von der Registerkarte, auf die der Benutzer klickt. Nehmen wir an, wenn es 3 Menüleiste Registerkarten, 1. Login 2. Register 3. Filmezeigen nur bestimmte Registerkarten auf der Seite an AngularJS

ich in den Filmen Registerkarte nur, wenn Benutzer sich anmeldet zeigen möchten.

Hier ist die Probe index.html ich habe.

<!DOCTYPE html> 
<html ng-app="movieflix"> 

<head> 
    <!-- bower:css --> 
    <!-- endinject --> 

    <!-- vendor:css --> 
    <!-- endinject --> 

    <!-- inject:css --> 
    <!-- endinject --> 

    <!-- app:css --> 
    <!-- endinject --> 
</head> 

<body class="main"> 
<header> 
    <ul class="nav nav-pills"> 
     <li><a href="#/movies">Movies</a></li> 
     <li><a href="#/login">Login</a></li> 
     <li><a href="#/register">Register</a></li> 
    </ul> 
</header> 

<section ng-view> 


</section> 

<!-- bower:js --> 
<!-- endinject --> 

<!-- vendor:js --> 
<!-- endinject --> 

<!-- inject:js --> 
<!-- endinject --> 

<!-- app:js --> 
<!-- endinject --> 
</body> 

</html>

Ich versuchte mit Controller, der die Wahl des Benutzers überprüft, aber das funktioniert nicht.

Jede Hilfe wird geschätzt.

Quelle

2016-05-04 vishwanath jayanth

Können Sie uns Ihren Controller-Code zeigen? – Giri

Hier ist mir Controller '(function() { var app = angular.module ('myApp', []); app.controller ('TabController', function() { this.tab = 1; this.setTab = function (tabId) { this.tab = tabId; }; this.isSet = function (tabId) { return this.tab === tabId; }; }); })(); ' –

das? Sie müssen $ scope.tab verwenden. Bitte lesen Sie die Angular-Dokumentation, um auf die korrekte Implementierung zu verweisen. Angular verwendet eine 2-Wege-Bindung, daher müssen Sie dieses Problem anders angehen. – Giri

Dazu erstellen drei verschiedene Flaggen zu zeigen, und verstecken Tabs. und aktualisiere den Wert dieses Flags gemäß der Benutzerauswahl.

Zum Beispiel

Erstellen einer Navigationssteuerung für Header-Tag.
In diesem Controller erstellen Sie drei verschiedene Flags und weisen diesem einen Standardwert zu. var displayLoginTab=true; var displayRegisterTab=false; displayMovieTab=false;

ändern Sie dann Ihre html wie oben

<header ng-controller="navigationController"> <ul class="nav nav-pills"> <li ng-if="displayMovieTab"><a href="#/movies">Movies</a></li> <li ng-if="displayLoginTab"><a href="#/login">Login</a></li> <li ng-if="displayRegisterTab"><a href="#/register">Register</a></li> </ul> </header>

Weil wir separaten Controller für diese, von einem anderen Controller versuchen Navigationssteuerung Variable zuzugreifen oder Variable von einem anderen Controller und Broadcast-Update, das aktualisieren. Hören Sie das Broadcast-Ereignis in NavigationController ab und aktualisieren Sie diesen Variablenwert.

Quelle

2016-05-04 05:41:41

Dies ist die beste Antwort. Vielen Dank. Ich habe dieses Problem gelöst. :) –

, um dies zu erreichen, u einen Dienst zum Speichern der Benutzer in protokolliert Daten verwenden müssen, Nach dem erfolgreichen Login speichert die Daten in Dienst als userData und in Ihrem Controller überprüfen, ob Benutzer angemeldet ist oder nicht durch userData Überprüfung , setzen dann showTab Variable als wahr oder falsch umgekehrt, und verwenden Sie diese Variable im Hinblick auf die Registerkarte ... Notiz anzeigen oder ausblenden: nicht anhängt Codes ...

Quelle

2016-05-04 05:38:22

zeigen nur bestimmte Registerkarten auf der Seite an AngularJS

Antwort

Verwandte Themen