Issue
So I have a structure like so:
{
documentGroup: {
Id: 000
Children: [
{
Id: 000
Status: 1
},
{
Id: 000
Status: 2
},...
]
},
},
Is there a way to write an ngIf statement to check if all Children elements have Status == 1
?
EDIT: When I try this
documentGroup.children.every(({status}) => status === 1)
I get the error:
Parser Error: Missing expected ) at column 41 in [documentGroup.children.every(({status}) => status === 1)
Solution
You will need add a new function into your component's .ts
file which would do the check for you and you can then reference it in the template as follows (documentsObj
is the object that contains the object in your example):
.ts
:
isAllStatusOne(): boolean {
return this.documentsObj.documentGroup.Children.every(({Status}) => Status === 1);
}
.html
:
*ngIf="isAllStatusOne()"
The above code should trigger change detection at the start and any time a property value changes in the documentsObj
object which should then proceed to check if all Children
have a Status
property that is 1. If they all are 1 - every
should return true
and the nested elements/components should be rendered.
Alternatively you can use find
which when using with Status !== 1
condition would return undefined
when all Status properties are 1, hence coupled with !
at the start it will result in true
:
isAllStatusOne(): boolean {
return !this.documentsObj.documentGroup.Children.find(({Status}) => Status !== 1);
}
Answered By - Ovidijus Parsiunas
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.