2016-08-02 14 views
0

Header-Verbindungen HTMLAngularJS - zeigen div Inhalt Id basierend geklickt

<ul ng-controller="pageRouteCtrl"> 
    <li ui-sref-active="active"> 
     <a ui-sref="home" class="" ng-click="getPageId('live-view')">LIVE</a> 
    </li> 
    <li> 
     <a ng-click="getPageId('playback')">PLAYBACK</a> 
    </li> 
</ul> 

Ctrl

myApp.controller('pageRouteCtrl', function ($scope, $rootScope) { 

    $scope.getPageId = function(id) { 
     $rootScope.route = id; 
    } 

}); 

Startseite HTML

//should be visible on page load and until playback link is clicked 
<div id="live-view" ng-show="route == 'live-view'"> 
SOME CONTENT 
</div> 

//will be hidden initially on page load 
<div id="playback" ng-show="route == 'playback'"> 
SOME CONTENT 
</div> 

Die oben Code funktioniert und zeigt <div> Inhalt basierend auf Link geklickt. Wenn der Benutzer anschließend auf Live oder Playback klickt, wird div-Inhalt angezeigt.

Wie mache ich live-view div zeigen standardmäßig beim Laden der Seite?

Antwort

0

schreiben folgenden Code in Controller:

myApp.controller('pageRouteCtrl', function ($scope, $rootScope) { 

$rootScope.route = 'live-view'; 

$scope.getPageId = function(id) { 
     $rootScope.route = id; 
     } 
     }); 
+0

Und was passiert, wenn Benutzer auf 'playback' Link klickt? Könnten Sie eine Antwort zum obigen Code posten? – Slimshadddyyy

+0

@Slimshadddyyy, als Standard 'live-view' div Show auf der Lade-Seite, wenn Benutzer klicken Sie auf' Wiedergabe' Link Wiedergabe Div wird angezeigt und Live-View div wird ausblenden – vaqifrv