Switch display

Ionic Framework
1

Hello,
I am new to JS, I have set up a switch for a crosstab but when I make a choice I have 3 displays in my console.
How to just have the choice ask.

Thank you in advance.

calcul.ts

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

@Component({
  selector: 'app-calcul',
  templateUrl: './calcul.page.html',
  styleUrls: ['./calcul.page.scss'],
})
export class CalculPage implements OnInit {

  intensity: any;
  poid: number;

  constructor() {
  }

  ngOnInit() {
  }
  calculTaux() {
    switch (this.intensity === "faible") {
      case (this.poid <= 11):
        console.log("faible 1")
        break;
      case (this.poid > 11 && this.poid <= 20):
        console.log("faible 2")
        break;
      case (this.poid > 21 && this.poid <= 40):
        console.log("faible 3")
        break;
      case (this.poid > 41 && this.poid <= 70):
        console.log("faible 4")
        break;
      case (this.poid > 71 && this.poid <= 110):
        console.log("faible 5")
        break;
      case (this.poid > 110):
        console.log("faible 6")
        break;
      default:
        console.log("Nous consulter")
        break;
    }
    switch (this.intensity === "moyen") {
      case (this.poid <= 11):
        console.log("moyen 1")
        break;
      case (this.poid > 11 && this.poid <= 20):
        console.log("moyen 2")
        break;
      case (this.poid > 21 && this.poid <= 40):
        console.log("moyen 3")
        break;
      case (this.poid > 41 && this.poid <= 70):
        console.log("moyen 4")
        break;
      case (this.poid > 71 && this.poid <= 110):
        console.log("moyen 5")
        break;
      case (this.poid > 110):
        console.log("moyen 6")
        break;
      default:
        console.log("Nous consulter")
        break;
    }
    switch (this.intensity === "forte") {
      case (this.poid <= 11):
        console.log("forte 1")
        break;
      case (this.poid > 11 && this.poid <= 20):
        console.log("forte 2")
        break;
      case (this.poid > 21 && this.poid <= 40):
        console.log("forte 3")
        break;
      case (this.poid > 41 && this.poid <= 70):
        console.log("forte 4")
        break;
      case (this.poid > 71 && this.poid <= 110):
        console.log("forte 5")
        break;
      case (this.poid > 110):
        console.log("forte 6")
        break;
      default:
        console.log("Nous consulter")
        break;
    }
  }
}

calcul.html

<ion-header>
  <ion-toolbar>
    <ion-buttons slot="start">
      <ion-back-button></ion-back-button>
    </ion-buttons>
    <ion-title>calcul</ion-title>
  </ion-toolbar>
</ion-header>

<ion-content>
  <div>
    <h1>Calculer mon besoin personnel</h1>
    <p>Nous allons éstimer un dosage moyen quotidien</p>
    <ion-label position="floating">Quel est votre poids?</ion-label>
    <ion-input [(ngModel)]="poid" type="number" placeholder="Saisir ici"></ion-input>
    <ion-list>
      <ion-radio-group [(ngModel)]="intensity">
        <ion-list-header>
          <ion-label>Quel est l'intensité de vos douleurs?</ion-label>
        </ion-list-header>

        <ion-item>
          <ion-label>Faibles</ion-label>
          <ion-radio slot="start" value="faible"></ion-radio>
        </ion-item>

        <ion-item>
          <ion-label>Moyennes</ion-label>
          <ion-radio slot="start" value="moyen"></ion-radio>
        </ion-item>

        <ion-item>
          <ion-label>Fortes</ion-label>
          <ion-radio slot="start" value="forte"></ion-radio>
        </ion-item>
      </ion-radio-group>
    </ion-list>
    <ion-button (click)="calculTaux()" expand="block" fill="clear" shape="round">
      Calculer mon taux
    </ion-button>
  </div>

</ion-content>

Captureapp
Captureapp1448×546 30.5 KB

2

I don’t think the switch construct is particularly appropriate here, but here is some useful documentation on how it is intended to be used.

Try rewriting calculTaux using only if and else - no switch or case. I think it will end up significantly more readable, in addition to probably being easier for you to write.

3

Hello,
thank you for your reply.
I did with if / elseif but I found the code not very understanding.
I finally add an if for each switch and it works well
I now have only 1 result displayed

Ludo