Calculate and get sum of an array using ionic angular

Question

I'm trying to get the sum of all the value that is on the array, I don't know how to do it. Here's my set of codes.

    <ion-content>
    <ion-card *ngFor="let question of questions">
    <ion-card-header>
      <ion-card-title>
        <h4>{{question.title}}</h4>
      </ion-card-title>
    </ion-card-header>
    <ion-card-content>
      <ion-text>
        <h6>Rating:</h6>
      </ion-text>
      <div margin-vertical text-center>
            <ion-radio-group [(ngModel)]="question.answer">
              <ion-item>
                <ion-radio value=0></ion-radio>
                <ion-label> Not at all</ion-label>
              </ion-item>
              <ion-item>
                <ion-radio value=2></ion-radio>
                <ion-label>For some of the time</ion-label>
              </ion-item>
              <ion-item>
                <ion-radio value=4></ion-radio>
                <ion-label>For most of the time</ion-label>
              </ion-item>
              <ion-item>
                <ion-radio value=5></ion-radio>
                <ion-label>For all of the time</ion-label>
              </ion-item>
            </ion-radio-group>
      </div>
    </ion-card-content>
  </ion-card>
  <div margin-vertical text-center>
    <ion-button (click)='getQuestionResults()'>SUBMIT</ion-button>
  </div>
</ion-content>

and here is the ts file.

import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';

export interface question {
title: string;
answer: number;
}
@Component({
selector: 'app-evaluation',
templateUrl: './evaluation.page.html',
styleUrls: ['./evaluation.page.scss'],
})
export class EvaluationPage implements OnInit {

questions: question[] = [];

constructor(private route: Router) { }

home(){
  this.route.navigate(['/home']);
}
Result(){
  this.route.navigate(['/result']);
}

ngOnInit() {
  // Questions
  for(let i = 1; i <= 1; i++) {
    this.questions.push({ title: `Little interest or pleasure in doing things`, answer: 
undefined });
    this.questions.push({ title: `Feeling down, depressed, or hopeless`, answer: undefined });
    this.questions.push({ title: `Trouble falling or staying asleep, or sleeping too much`, 
answer: undefined });
    this.questions.push({ title: `Feeling tired or having little energy`, answer: undefined });
    this.questions.push({ title: `Often has difficulty organizing tasks or activities`, 
answer: undefined });
    this.questions.push({ title: `Trouble concentrating on things, such as reading the 
newspaper or watching television`, answer: undefined });
    this.questions.push({ title: `Feeling bad about yourself — or that you are a failure or 
have let yourself or your family down`, answer: undefined });
  
    }
  }
  getQuestionResults() {
    console.log(this.questions);
  }

this is what it looks like in the console, the value I set on the HTML file for an answer is an integer and I want to add all the answers to get the quiz result. How can I sum up all the values and get the result after getting the total result I want to put an equivalent value to it and print it to the application.

Danil Prokhorenko · Accepted Answer · 2021-07-14 04:28:26Z

1

Seems, you have some lack of basic programming knowledge. Anyway, you can use one of these options:

Just sum in for cycle:

let sumA = 0;
for (const q of this.questions) {
    sumA += Number(q.answer || 0);
}

Or use reduce (or map with reduce):

const sumB = this.questions
    .map(q => Number(q.answer || 0))
    .reduce((a, b) => a+b, 0);

You should keep in mind that you can get string value from your HTML despite your type declaration. You need to typecast your value to number.

Also, this value can be undefined. value || 0 can help handle undefined values in sum.

edited Jul 14, 2021 at 4:28

answered Jul 14, 2021 at 4:21

Danil Prokhorenko

1,1041 gold badge11 silver badges28 bronze badges

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

Comments

vicnoob · Accepted Answer · 2021-07-14 04:31:04Z

1

I think Array.reduce would fit your problem. Reference: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce

let initialValue = 0;
let sum = this.questions?.reduce(function (accumulator, currentValue) {
    return currentValue?.answer ? accumulator + +currentValue.answer : accumulator;
}, initialValue)

edited Jul 14, 2021 at 4:31

answered Jul 14, 2021 at 4:12

vicnoob

1,17313 silver badges27 bronze badges

Collectives™ on Stack Overflow

Calculate and get sum of an array using ionic angular

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related