我是AngularJS
的新手,正在处理项目中的一个小模块。我想根据条件显示两个div
。条件是如果{{ merchandiser.popCode }}
表示数据库中存在popcode值,则显示div1 else显示div2。这是我的代码片段
<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>
答案 0 :(得分:1)
您可以将ng-if
用于Angular模板中的if(){..} else {..}逻辑。
根据您目前的情况,
<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>
答案 1 :(得分:1)
试试这个:
<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>