2016-08-02 70 views
0

標題鏈接HTMLAngularJS - 根據ID顯示DIV內容點擊

<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; 
    } 

}); 

主頁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> 

的以上代碼工作並基於鏈接點擊顯示<div>內容。隨後,當用戶點擊Live或Playback時,div內容將顯示。

我該如何讓live-view div在頁面加載時默認顯示?

回答

0

寫在控制器下面的代碼:

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

$rootScope.route = 'live-view'; 

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

當用戶點擊'playback'鏈接會發生什麼?你可以發佈有關上述代碼的答案嗎? – Slimshadddyyy

+0

@Slimshadddyyy,作爲默認的'live-view' div在加載頁面上顯示,當用戶點擊'playback'時,鏈接播放div會顯示,live-view div會隱藏 – vaqifrv