How to display ng-repeat data with certain conditions - AngularJS

Question

This is my json object response:

{
"draftType": "manualinput",
"senderdata": "123456789",
"senderName": "ifelse",
"message": "Hi",
"draftName": "Testing"
}

I am displaying this in UI using ng-repeat:

controllers.js:

$http({
   method: 'GET',
   url: '/api/getdraft'

}).then(function (response) {
   $scope.drafts = response.data;
}, function (response) {
   console.log(response);
});

my code:

tr(ng-repeat='draft in drafts')
 td {{draft.draftName}}
 td {{draft.senderName}}
 td {{draft.message}}

But i need some condition, if my draftType object key have string called "manualinput" i want to display datas,

sometimes draftType will come as "contactinput",

so i dont want to display if my draftType is not equal to "manualinput".

Is this possible to do?

Use ng-if="draft.draftType.includes('manualinput')" inside ng-repeat. — Tushar
– Tushar, Commented Jan 9, 2018 at 5:29

Sameer · Accepted Answer · 2018-01-09 07:52:08Z

2

You need to use ng-if with ng-repeat

CODE:

tr(ng-repeat='draft in drafts' ng-if="draft.draftType === 'manualinput'")

edited Jan 9, 2018 at 7:52

Sameer

3,6385 gold badges27 silver badges55 bronze badges

answered Jan 9, 2018 at 5:28

Sajeetharan

223k65 gold badges370 silver badges409 bronze badges

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

2 Comments

Sameer Over a year ago

post full answer! it will helpful to me, this should be in comment section :)

Sajeetharan Over a year ago

i am typing from phone, it takes some time :P

Gitesh Purbia · Accepted Answer · 2018-01-09 05:30:01Z

2

You can add ng-if with ng-repeat. please try with this.

tr(ng-repeat='draft in drafts') data-ng-if="draft.draftType === 'manualinput'"
 td {{draft.draftName}}
 td {{draft.senderName}}
 td {{draft.message}}

answered Jan 9, 2018 at 5:30

Gitesh Purbia

1,1042 gold badges12 silver badges29 bronze badges

Collectives™ on Stack Overflow

How to display ng-repeat data with certain conditions - AngularJS

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related