2016-05-09 131 views
0

HTML爲什麼ng-show不起作用?

<div class="col-sm-1"> 
    <a class="a" ng-click="aa()"> 
     <span name="yesLink"></span> 
    </a>    
</div>             
<div class="col-sm-1"> 
    <a class="a" ng-click="bb()">   
    <span name="NoLink"></span>   
    </a> 
</div> 
<div id="nnn" class="col-sm-7" align="left" > 
    <p ng-show="yes"> Text for yes</P> 
    <p ng-show="no"> Text for no</P> 
</div> 

JS

yesLink.onclick()=function() 
{ 
     scope.yes=true; 
} 

noLink.onclick()=function() 
{ 
     scope.no=true; 
} 

我已經使用上述code.I要顯示根據click.But它不工作的消息。這段代碼有什麼問題? 如果單擊yesLink,則會出現「Text for Yes」,如果單擊NoLink,則應出現「Text for no」。

回答

0

您正在檢查的值是一個布爾值,但您分配給該變量的值是一個字符串。您有兩個選項>

選項1: 告訴ng-hide/show值查找字符串值, ng-show =「yes ==='true'」。

選項2: 在你的函數換出字符串布爾值, scope.yes =真實,不scope.yes =「真」

2

我認爲,沒有必要添加的onclick方法。只是這樣做

<div class="col-sm-1"> 
<a class="a" ng-click="yes=true"> 
    <span name="yesLink"></span> 
</a>    
</div>             
<div class="col-sm-1"> 
    <a class="a" ng-click="yes=false;">   
     <span name="NoLink"></span>   
    </a> 
</div> 
<div id="nnn" class="col-sm-7" align="left" > 
    <p ng-show="yes"> Text for yes</P> 
    <p ng-hide="yes"> Text for no</P> 
</div> 
+1

你可以使用'NG隱藏= 「是」',而不是'NG秀= 「是!」'以提高可讀性。 – Ankh

+0

是的,你是對的@Ankh。 –

2

我看到角在上面的代碼被用於這樣的HTML部分將

控制器部分應該是這樣

考慮BB()和AA()作爲點擊功能

$scope.bb = function(){ 
$scope.yes = true; 
} 

$scope.aa = function(){ 
$scope.no = true; 
} 
0

無需jQuery的,你可以使用ng-click,NG-點擊觸發功能CONTROLER

<div class="col-sm-1"> 
    <a class="a" ng-click="aa()"> 
     <span name="yesLink"></span> 
    </a>    
</div>             
<div class="col-sm-1"> 
    <a class="a" ng-click="bb()">   
    <span name="NoLink"></span>   
    </a> 
</div> 
<div id="nnn" class="col-sm-7" align="left" > 
    <p ng-show="yes"> Text for yes</P> 
    <p ng-show="no"> Text for no</P> 
</div> 

JS

scope.aa() = function(){ 
    scope.yes = true; 
} 

scope.bb() = function(){ 
    scope.no = true; 
}