CODEWITHSUNDEEP
javascripthtmlvue.js
bflydesign
bflydesign

Reputation: 483

How to compare value of property in vue.js

I want to use the if-directive in vue.js to determine which datafield should be shown in each table row:

<tr v-repeat="model">
    <td>@{{ title }}</td>
    <td>@{{ publish_date_start }}</td>
    <td v-if="model.publish = 1"><span class="fa fa-check"></span></td>
    <td v-if="model.publish = 0"><span class="fa fa-remove"></span></td>
    <td class="data-list-action"><a href="/admin/news/@{{ id }}/edit" class="btn btn-warning">edit</a></td>
    <td class="data-list-action"><a href="#" v-on="click: deleteRequest(id)" class="btn btn-danger">delete</a></td>
</tr>

If the value of the property 'publish' is 1, the datafield with the check has to be shown. If 0, it has to be the a cross.

How can I compare 'model.publish' to a value?

UPDATE: Fiddle

Upvotes: 0

Views: 1419

Answers (1)

Ivan Jovović
Ivan Jovović

Reputation: 5298

Try with v-if:

<td v-if="publish"><span class="fa fa-check">Check</span></td>
<td v-if="!publish"><span class="fa fa-remove">Cross</span></td>

Fiddle: http://jsfiddle.net/8wy7w560/3/

Upvotes: 1

Related Questions