填充體顯示登錄頁面

在angularjs（1.3）和Bootstrap 3（定製類），我有以下的索引結構：填充體顯示登錄頁面

<html ng-app="myApp"> 
... 
<body> 
    <main class="page-content container"> 
     <div ng-include src="'Views/Partials/Navbar.html'"></div> 
     <div ng-include src="'Views/Partials/Sidebar.html'"></div> 

     <div class="page-inner"> 
      <div ng-view> 
      </div> 
     </div> 
    </main> 
</body> 
... 
</html>

所以我有導航欄和內容DIV的盒裝佈局在那裏我使用$ routeProvider顯示內容頁面。

enter image description here

現在我想表明，填充了整個窗口，所以它不是裏面的頁面內的div一個登錄頁面。

我怎樣才能實現它與角？因爲ng-view在page-inner div內部，我想在body層面注入我的html頁面。

感謝

來源

2015-05-16 Tom

您可以使用ng-hide隱藏導航欄/側邊欄和ng-class取決於當前位置（登錄或網站內容）使用$location.url()不同css應用到您的內容。

是這樣的：

<html ng-app="myApp"> 
... 
<body> 
    <main class="page-content container"> 
     <div ng-show="show.navbar" ng-include src="'Views/Partials/Navbar.html'"></div> 
     <div ng-show="show.sidebar" ng-include src="'Views/Partials/Sidebar.html'"></div> 

     <div ng-class="{{css.innerContent}}"> 
      <div ng-view> 
      </div> 
     </div> 
    </main> 
</body> 
... 
</html>

控制器：

//show navbar/sidebar by default 
$scope.show = { 
    navbar : true, 
    sidebar : true 
} 
//default values for css class 
$scope.css = { 
    innerContent : "page-inner" 
} 
//check current location and assign new values 
if($location.url() == "/login"){ 
    $scope.show.navbar = false; 
    $scope.show.sidebar = false; 
    $scope.css.innerContent = "login-inner" 
}

CSS：

//example of css 
.page-inner{ 
    width:50%; 
} 
.login-inner{ 
    width:100%; 
}

來源

2015-05-16 15:02:57 Merlin

填充體顯示登錄頁面

回答

相關問題