2016-05-09 5 views
0

HTMLなぜng-showが機能しないのですか?私はcode.I上で使用している

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

は、それが機能していないclick.Butに従ってメッセージを表示したいです。このコードで何が問題になっていますか? yesLinkをクリックすると「はい」のテキストが表示され、NoLinkをクリックすると「いいえのテキスト」が表示されます。

答えて

0

チェックする値はブール値ですが、変数に割り当てる値は文字列です。 2つのオプションがあります>

オプション1: ng-hide/showの値に文字列値 ng-show = "yes === 'true'を検索するように指示します。

OPTION 2:

2

私が思う= "true" をscope.yes scope.yes =真とNOTブール値の文字列アウトあなたの関数のスワップ、では、onclickのメソッドを追加する必要はありません。ちょうど私がHTMLの一部が

お使いのコントローラ部は、BBを考慮

(のようなものであるべきこと)及びAA()のようになりますので、角度は上記のコードで使用されている参照この

<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

あなたは、読みやすさを向上させるために、 '= "yes" を'むしろNG-ショー 'より= "YES!"' NG非表示を使用することができます。 – Ankh

+0

ええ、あなたは正しい@Ankhです。 –

2

を行いますクリック機能

$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; 
} 
関連する問題