如何在AngularJS中顯示隱藏的元素？

Question

是否有可能隱藏默認的元素（以便它不顯示JavaScript是否關閉），並讓AngularJS重寫樣式以顯示它？

我有範圍的函數應該返回一個壓倒一切的樣式顯示元素：

$scope.style = function() { 
    return { "display": "block!important" }; 
} 

元素本身具有原始CSS隱藏它，以及一個ng-style指令：

<h4 class="original" ng-style="style()"> 

的CSS隱藏元件在第一：

.original { 
    display: none; 
} 

釷ere是非工作的demo here。

Answer 1

它的工作原理。 實際的問題是在這裏：

ul { 
    list-style-type: none; 
    color: #fff; 
} 

白在白色背景（#fff）文本。刪除color: #fff;它會工作。

這是一個working蹲跳者。另外，!importantdoes not work與ng-style。

Answer 2

你可以使用ng-class：

<p class="hidden" ng-class="{visible: show}">Lorem ipsum dolor</p> 

然後有兩個CSS類：

.hidden { 
    display: none; 
} 
.visible { 
    display: block; 
} 

而且show屬性添加到範圍（它可以是一個NG-模型以及）：

$scope.show = true; 

演示：http://jsbin.com/qibu/1/edit

Answer 3

您可以嘗試納克級

.show { 
    display: block !important; 
} 

<h4 class="original" ng-class="{show: isJSon}"> 

$scope.isJSon = true;