2017-02-03 1 views
1

Ich bin neu in AngularJS und versuche, show in angularJs zu verstecken.ng-if condition in angularJs

ist unter meinem Code:

<ul class="recent-rate-list"> 
     <li ng-repeat="ratedType in ratedTypes"> 
      <a href="#" style="line-height:30px">{{ratedType.type}}</a> 
     </li> 
    </ul> 

AngularJS:

 $scope.ratedTypes = [ 
     { 
      type: 'Select All', 
      "value": '0', 
      isSelected : true 
     }, { 
      type: 'Option 1', 
      "value": '1', 
      isSelected: false 
     }, { 
      type: 'Option 2', 
      "value": '2', 
      isSelected: false 
     },{ 
      type: 'Option 3', 
      "value": '3', 
      isSelected: false 
     }, 
    ]; 

Wo ich, wenn isSelected = true dann

 <a href="#" style="line-height:30px"><span>{{ratedType.type}}</span></a> 

und wenn isSelected = false dann

 <a href="#" style="line-height:30px">{{ratedType.type}}</a> 
brauchen

Ich weiß angularJs hat ng-wenn, aber ich kann es nicht verwenden. Wie kann ich es mit ng-if lösen?

Danke.

Antwort

1

Sie können ng-if-Bedingung in das div-Tag einfügen.

<div ng-if="isSelected === true"><a href="#" style="line-height:30px"><span>{{ratedType.type}}</span></a></div> 
 

 
<div ng-if="isSelected === false"><a href="#" style="line-height:30px">{{ratedType.type}}</a><div>

0

können Sie eher hinzufügen wie this-

<div ng-if="isSelected"><a href="#" style="line-height:30px"><span>{{ratedType.type}}</span></a></div> 

<div ng-if="!isSelected"><a href="#" style="line-height:30px">{{ratedType.type}}</a><div> 

und in Ihrem Controller define-

$scope.isSelected = false; 

this helps :)