IF Statement in Typescript/Angular

Question

I am trying to get a the correct pop-up message depending on a users input.

If the user is a 'Con Owner' they must fill out all items labelled as 'Con'. If they do not, they should have a warning message when they click submit.

I have written the below to loop through each item and where the owner of that item is equal to Con and the Value is empty it should give me the warning message. If they have filled it in, it should be the confirmation message.

However, the below isn't giving me the results I require. Irrespective of what happens, I always get the warning message as a pop up, even if the value has been populated.

  isValuePopulated() {  
    let attrData = this.attributes.attrData;
    let isAttributeCompleted = true;
    attrData.forEach(item=>{
      if(item.owner==='Con' && commonFunctions.isEmptyString(item.value)){
        isAttributeCompleted = false;
      }}
      );
    if (isAttributeCompleted){
      this.showErrorInfoPopUp('All correct!!!!', 'Confirmation', true);      
    } else {
      this.setErrorPopUpButtonStatus(true, false, true);
      this.showErrorInfoPopUp('Are you sure you want to continue?', 'Warning', true);
    }
  }

Edit: Thanks for the comments so far I have since removed the commonFunctions.isEmptyString(item.value)) as suggest. But I assume the error is down to the loop being asyc (also mentioned). However, as I am new to this, I am not sure how to resolve this. My first thought was to have two methods and have one loop through the items and then push the value to another method which determines the pop up. But I keep getting a "Expression Expected" error message when trying to build.

  isValuePopulated() {  
let attrData = this.attributes.attrData;
let isAttributeCompleted = true;
attrData.forEach(item=>{
  if(item.owner==='Con' && !item.attributeValue){
    isAttributeCompleted = false;  
      }}
      );
      this.typeOfPopUp(isAttributeCompleted )
  }

  typeOfPopUp(isAttributeCompleted ){

  if (isAttributeCompleted ){
    this.setErrorPopUpButtonStatus(true, false, true);
    this.showErrorInfoPopUp('All correct!!!!', 'Confirmation', true);      
  } else {
    this.setErrorPopUpButtonStatus(true, false, true);
    this.showErrorInfoPopUp('Are you sure you want to continue?, 'Warning', true);
  }
}

meed to see some sample data of what attrData might look like.. also commonFunctions.isEmptyString() is very not needed... just do !item.value — bryan60
– bryan60, Commented Nov 23, 2019 at 16:32
Check if it enters the if statement. May be your if statement is always false — Angela Amarapala
– Angela Amarapala, Commented Nov 23, 2019 at 16:34
forEach is async your if condition is being executed before loop is finished. — Talha Junaid
– Talha Junaid, Commented Nov 23, 2019 at 16:47

talhature · Accepted Answer · 2019-11-23 19:27:33Z

2

While the point thats made by @Jérôme is true, the issue you face is because you expect an async code block to run syncroniously. You can use a simple for-of loop instead.

for (const item of arrayData)

edited Nov 23, 2019 at 19:27

answered Nov 23, 2019 at 17:21

talhature

2,1851 gold badge17 silver badges31 bronze badges

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

Comments

Jérôme · Accepted Answer · 2019-11-23 17:14:34Z

1

As a comment said, replace your function isEmptyString() by !item.value. The condition if (item.value) will evaluates to true if item.value is NOT :

undefined
empty string
NaN
null
0
false

Source

answered Nov 23, 2019 at 17:14

Jérôme

561 silver badge5 bronze badges

1 Comment

LearnerCode Over a year ago

Thanks. I have taken this comment and the original comment on board. And updated the post. please see edit

LearnerCode · Accepted Answer · 2019-11-23 17:34:16Z

Thanks for the suggestions. I didn't realise the loop I was orignally using was async and didn't realise there is alternative non-async loop solution The following code worked:

  isValuePopulated() {  
    let attrData = this.attributes.attrData;
    let attributeCompleted: boolean = true;
    for (const item of attrData){
      if(item.owner==='Con' && !item.value){
        attributeCompleted = false;
      }

    }
    if (attributeCompleted){
      this.setErrorPopUpButtonStatus(true, false, true);
      this.showErrorInfoPopUp('All correct!!!!', 'Confirmation', true);      
    } else {
      this.setErrorPopUpButtonStatus(true, false, true);
      this.showErrorInfoPopUp('Are you sure you want to continue?', 'Warning', true);
    }
  }

Collectives™ on Stack Overflow

IF Statement in Typescript/Angular

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related