0

characters table

hello guyz in the image above am trying to show a button if the character isDead = true but the button doesn't display. here is my code:

<table class="table table-striped table-bordered">
            <thead>
                <tr>
                    <th>Name</th>
                    <th>Age</th>
                    <th>isDead</th>
                    <th>Resurrect</th>
                    <th>Increase Age</th>
                    <th>Details</th>
                </tr>
            </thead>
            <tbody>
                <tr ng-hide="products.length">
                    <td colspan="3" class="text-center">No Data</td>
                </tr>
                <tr ng-repeat="item in products">
                    <td>{{item.name}}</td>
                    <td>{{item.age}}</td>
                    <td>{{item.isDead}}</td>
                    <td ng-if="item.isDead == 'true' ">
                        <button class="btn btn-success">Resurrect</button>
                    </td>
                    <td></td>
                    <td></td>
                </tr>
            </tbody>
        </table>

thanks for your help

baezl
  • 13
  • 5

3 Answers3

1

Convert this 

<td ng-if="item.isDead == 'true' ">

to this

<td ng-if="item.isDead">

N:B: using ng-if in td will break your html.

Anik Islam Abhi
  • 25,137
  • 8
  • 58
  • 80
1

I am not clear on what the value of item.isDead is, but if it is a boolean and not a text representation of one, then you should simply use:

ng-if="item.isDead"

This is because this is evaluating for a true/false, and item.isDead already provides that.

Also, in regard to the HTML this will output, you should change to:

<td>
    <button class="btn btn-success" ng-if="item.isDead">Resurrect</button>
</td>

Otherwise, on items where item.isDead is true, you will end up with mis-matched columns as there will be one less cell on these rows.

Brian
  • 4,921
  • 3
  • 20
  • 29
0

It would be better to use ng-show like this:

<td ng-show="item.isDead">

Or better for the design use the ng-show on the Button element.

SeRu
  • 314
  • 1
  • 6
  • http://stackoverflow.com/questions/21869283/when-to-favor-ng-if-vs-ng-show-ng-hide some short summary why/when to use ng-if and when to use ng-show or ng-hide – SeRu May 26 '16 at 09:54