bedingte Prüfung basierend auf Eingabe

Question

Mit angularjs, wie kann ich die zusätzlichen Registerkarten basierend auf dem URL-Parameter anzeigen. Beispiel: Wenn der Benutzer die URL http://myURL.com eingibt, sollte er tab1, tab2 anzeigen und wenn der Benutzer die URL http://myURL.com/showAll eingibt, sollte er tab1, tab2, tab3 anzeigen.

Demo: http://plnkr.co/edit/z4h5sfcaZLDXZ8xI7KDU?p=preview

habe ich versucht, wie unten bedingte Prüfung mit:

<div ng-show="showAll"> 
<div..> 

//tab content 
</div></div> 

Die obige ng-Show nur den Inhalt innerhalb des Registerkarte versteckt auf der Grundlage des bedingten Scheck, aber ich mag verstecken Das Tab3 wird angezeigt, wenn der Benutzer die URL http://myURL.com anstelle von http://myURL.com/showAll angibt.

Alle Eingaben wären hilfreich.

PS: Genommen von show or hide the element based on the user input, aber wie ich sagte, es versteckt nicht die Registerkartenanzeige auf der Benutzeroberfläche, sondern versteckt nur den Inhalt innerhalb der Registerkarte basierend auf der URL-Eingabe.

--- EDITED ABSCHNITT --- app.js Code:

myApp.config(function($routeProvider) { 
    $routeProvider.when('/', { 
     templateUrl: 'index.html', 
     controller: 'mainController' 
    }).when('/home', { 
     templateUrl: 'index.html', 
     controller: 'mainControler' 
    }).when('/showAll', { 
     templateUrl: 'index.html', 
     controller: 'showAllController' 
    })}); 

    myApp.controller('showAllController', function ($rootScope) { 
    $rootScope.status = true; 
}); 

I $ rootScope.status = true hinzugefügt haben; in der Steuerung, die aufgerufen wird, wenn der Benutzer die URL http://myURL.com/showURL eingibt. Aber immer noch ist die Registerkarte ausgeblendet.

Answer 1

Die kurze Lösung für Ihre Anforderung Sie erhalten auch in der Registerkarte Liste

<ul class="nav nav-tabs" role="tablist"> 
     <li role="presentation" class="{{ tab.tabValue == activeModule? 'active':''}}" ng-repeat="tab in tabs"> 
      <a ng-show="tab.status" href="javascript:void(0)" ng-click="tabAction(tab.tabValue,tab.tabName)">{{tab.tabName}}</a> 
     </li> 
     </ul> 

in der Steuerung setzen können:

$scope.tabs=[{"tabName":"Tab1","tabValue":"tab1Value","status":true},{"tabName":"Tab2","tabValue":"tab2Value","status":true},{"tabName":"Tab3","tabValue":"tab3Value",,"status":false}]; 

Ändern Sie die Registerkarte Status nach URL

prüfen Arbeiten Code