angularjs if else condition does not work

Question

i am new in AngularJS and working on a small module in a project. I want to show two div based on condition. The condition is if {{ merchandiser.popCode }} means popcode value exist in database then show div1 else show div2. Here is my code snippet

<tr ng-repeat="merchandiser in data.merchandisers  | filter: filter()">
        <td title = "({{ merchandiser.id }})">{{ $index + 1 }}</td>
        <td>{{ merchandiser.createdOnDate }}</td>
        <!--<td>{{ merchandiser.createdOnTime }}</td>-->
        <td>{{ merchandiser.pjpCode }} </td>
        <td>{{ merchandiser.sectionCode}}</td>
        <td>{{ merchandiser.popCode }}</td>
        <td>{{ merchandiser.popName }}</td>
        <td>{{ merchandiser.popStatus }} </td>
        <td>{{ merchandiser.channel }} </td>
</table>
<div class="row">


      <div id = "div1" class = "col-sm-4" >

        <table class = "table">
          <tr class="colour">
            <th>POP Classification</th>
            <td>{{ popData.popClassification }}</td>
          </tr>
          <tr>
            <th class="colour">Owner's Name</th>
            <td>{{ popData.ownerName }}</td>
          </tr>
          </div>
 <div id = "div2" class = "col-sm-4" >

    <table class = "table">

      <tr>enter code here
        <th class="colour">Owner's Name</th>
        <td>{{ popData.ownerName }}</td>
      </tr>
      </div>

He's asking for AngularJS

Wesley Coetzee
– Wesley Coetzee

2017-09-12 10:23:11 +00:00
Commented Sep 12, 2017 at 10:23 — Wesley Coetzee
– Wesley Coetzee, Commented Sep 12, 2017 at 10:23
@WesleyCoetzee he initially tagged it with Angular2..

Vishal
– Vishal

2017-09-12 10:44:51 +00:00
Commented Sep 12, 2017 at 10:44 — Vishal
– Vishal, Commented Sep 12, 2017 at 10:44

Chandru · Accepted Answer · 2017-09-12 10:41:02Z

1

Try this :

<div id="div1" ng-if="merchandiser.popCode">
<!-- Condition true show Div1 block content -->
</div>
<div id="div2" ng-if="!merchandiser.popCode">
<!-- Condition false show Div2 block content -->
</div>

answered Sep 12, 2017 at 10:41

Chandru

11.2k6 gold badges43 silver badges54 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Vishal · Accepted Answer · 2017-09-12 10:44:22Z

1

You can use ng-if for if(){..} else{..} logic in Angular template.

For your current situation,

<div id="div1" ng-if="merchandiser.popCode">
<!-- If block i.e div1 -->
</div>
<div id="div2" ng-if="!merchandiser.popCode">
<!-- Your Else Block i.e div2 -->
</div>

edited Sep 12, 2017 at 10:44

answered Sep 12, 2017 at 10:15

Vishal

11k22 gold badges90 silver badges136 bronze badges

Collectives™ on Stack Overflow

angularjs if else condition does not work

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related