IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

  1. #1
    Membre du Club
    Homme Profil pro
    Étudiant
    Inscrit en
    février 2020
    Messages
    54
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 21
    Localisation : France, Bas Rhin (Alsace)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : février 2020
    Messages : 54
    Points : 42
    Points
    42
    Par défaut Modification de variable à chaque évolution d'un observable.
    Bonsoir.
    J'ai implémenté un component qui utilise un observable, modifié par un service.

    J'ai besoin de modifier une variable dès que cet observable évolue. J'ai vu qu'il existait des Subjects et BehaviorSubject mais je n'arrive pas bien à les utiliser sur mon programme.

    Voici mon componnent:

    Code typescript : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
     
    import { Component, OnInit } from '@angular/core';
    import { Impact } from '../impact';
    import { ImpactsService } from '../impacts.service';
     
     
    @Component({
      selector: 'app-impacts-list',
      templateUrl: './impacts-list.component.html',
      styleUrls: ['./impacts-list.component.css']
    })
    export class ImpactsListComponent implements OnInit {
     
      public impacts :Impact[];
      public score:number;
      public computing:string;
     
      constructor(private impactsService: ImpactsService) {
        this.impacts = [];
        this.score = 0;
        this.computing = "decimals";
      }
     
      getImpacts(): void {
        this.impactsService.getImpacts().subscribe(impacts => this.impacts = impacts);
      }
     
      compute(){
        if(this.computing == "integers"){
          this.score=0;
          for(var i=0; i<this.impacts.length;i++){
            this.score += Math.floor(this.impacts[i].score);
          }
     
        } else {
          this.score=0;
          for(var i=0; i< this.impacts.length;i++){
            this.score += this.impacts[i].score;
          }
          this.score = parseFloat(this.score.toFixed(1));
        }
      }
     
      ngOnInit(): void {
        this.getImpacts();
        this.compute();
      }
    }

    Je souhaite modifier la variable score à chaque évolution de l'observable impacts.
    J'ai essayé de le modifier dans le subscribe de getImpacts(), mais cela ne m'a pas semblé une bonne pratique et cela ne fonctionne de toute façon pas.

    Merci pour votre aide !

  2. #2
    Membre confirmé
    Homme Profil pro
    Développeur Web
    Inscrit en
    janvier 2019
    Messages
    342
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 38
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : janvier 2019
    Messages : 342
    Points : 514
    Points
    514
    Par défaut
    pas sur d'avoir compris fonctionnellement le truc !

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
     
     
    import { Component, OnInit } from '@angular/core';
    import { Impact } from '../impact';
    import { ImpactsService } from '../impacts.service';
     
     
    @Component({
      selector: 'app-impacts-list',
      templateUrl: './impacts-list.component.html',
      styleUrls: ['./impacts-list.component.css']
    })
    export class ImpactsListComponent implements OnInit {
     
      public impacts :Impact[];
      public score:number;
      public computing:string;
     
      constructor(private impactsService: ImpactsService) {
        this.impacts = [];
        this.score = 0;
        this.computing = "decimals";
      }
     
      getImpacts(): void {
        this.impactsService.getImpacts().subscribe(impacts => 
           return this.compute(impacts);
        );
      }
     
      compute(impacts){
        if(this.computing == "integers"){
          this.score=0;
          for(var i=0; i<impacts.length;i++){
            this.score += Math.floor(impacts[i].score);
          }
     
        } else {
          this.score=0;
          for(var i=0; i< impacts.length;i++){
            this.score += impacts[i].score;
          }
          this.score = parseFloat(this.score.toFixed(1));
        }
      }
     
      ngOnInit(): void {
        this.getImpacts();
      }
    }

  3. #3
    Membre du Club
    Homme Profil pro
    Étudiant
    Inscrit en
    février 2020
    Messages
    54
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 21
    Localisation : France, Bas Rhin (Alsace)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : février 2020
    Messages : 54
    Points : 42
    Points
    42
    Par défaut
    Malheureusement votre solution ne fonctionne pas :/

    Quelques précisions concernant mon programme :
    - La fonction compute est appelée lors d'une modification apportée à un objet <select>. Elle sert uniquement à modifier la variable score en fonction des valeurs du tableau impacts. Je souhaite donc aussi l'appeler à chaque fois que le tableau impacts est mis-à-jour.
    - L'observable impacts est mis-à- jour via getImpacts(). impacts est aussi un tableau de données appartenant à un service qui est mis-à-jour lorsqu'il en reçoit de nouvelles via un serveur.

  4. #4
    Membre confirmé
    Homme Profil pro
    Développeur Web
    Inscrit en
    janvier 2019
    Messages
    342
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 38
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : janvier 2019
    Messages : 342
    Points : 514
    Points
    514
    Par défaut
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
     
    import { Component, OnInit } from '@angular/core';
    import { Impact } from '../impact';
    import { ImpactsService } from '../impacts.service';
     
     
    @Component({
      selector: 'app-impacts-list',
      templateUrl: './impacts-list.component.html',
      styleUrls: ['./impacts-list.component.css']
    })
    export class ImpactsListComponent implements OnInit {
     
      public impacts :Impact[];
      public score:number;
      public computing:string;
     
      constructor(private impactsService: ImpactsService) {
        this.impacts = [];
        this.score = 0;
        this.computing = "decimals";
      }
     
      getImpacts(): void {
        this.impactsService.getImpacts().subscribe(impacts => 
    {
    this.impacts = impacts
    this.compute();
    }
    );
      }
     
      compute(){
        if(this.computing == "integers"){
          this.score=0;
          for(var i=0; i<this.impacts.length;i++){
            this.score += Math.floor(this.impacts[i].score);
          }
     
        } else {
          this.score=0;
          for(var i=0; i< this.impacts.length;i++){
            this.score += this.impacts[i].score;
          }
          this.score = parseFloat(this.score.toFixed(1));
        }
      }
     
      ngOnInit(): void {
        this.getImpacts();
        this.compute();
      }
    }

  5. #5
    Membre du Club
    Homme Profil pro
    Étudiant
    Inscrit en
    février 2020
    Messages
    54
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 21
    Localisation : France, Bas Rhin (Alsace)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : février 2020
    Messages : 54
    Points : 42
    Points
    42
    Par défaut
    C’est malheureusement la première solution que j’aie essayée mais elle ne fonctionne pas :/

  6. #6
    Expert confirmé

    Homme Profil pro
    Développeur .NET
    Inscrit en
    novembre 2010
    Messages
    2 002
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Rhône (Rhône Alpes)

    Informations professionnelles :
    Activité : Développeur .NET

    Informations forums :
    Inscription : novembre 2010
    Messages : 2 002
    Points : 4 054
    Points
    4 054
    Par défaut
    Ca serait pas mal d'avoir l'html aussi

  7. #7
    Membre du Club
    Homme Profil pro
    Étudiant
    Inscrit en
    février 2020
    Messages
    54
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 21
    Localisation : France, Bas Rhin (Alsace)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : février 2020
    Messages : 54
    Points : 42
    Points
    42
    Par défaut
    Le voici, mais je suis pas sur qu'il vous serve à grand chose ... :

    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    <div class="details">
        <h1>Session details</h1>
        <div class="computing">
            <h4>Select computing mode:</h4>
            <select [(ngModel)]="computing" (change)="compute()">
                <option value="decimals" selected>Decimals</option>
                <option value="integers">Integers</option>
            </select>
        </div>
        <div class="shotList">
                <table>
                    <tr *ngFor="let shot of impacts">
                        <td class="badge">{{shot.id}}: </td>
                        <td> <strong> X:</strong>{{shot.x | number : '1.1-1'}}</td>
                        <td><strong>Y:</strong>{{shot.y | number : '1.1-1'}}</td>
                        <td><strong>Score : </strong>{{shot.score | number : '1.1-1' }}</td>
                    </tr>
                </table>
            </div> 
        <div class="score">
            <h4>Your total score :</h4>
            <div class="totalScore">
                {{score}}
            </div>
        </div>
    </div>

  8. #8
    Expert confirmé

    Homme Profil pro
    Développeur .NET
    Inscrit en
    novembre 2010
    Messages
    2 002
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Rhône (Rhône Alpes)

    Informations professionnelles :
    Activité : Développeur .NET

    Informations forums :
    Inscription : novembre 2010
    Messages : 2 002
    Points : 4 054
    Points
    4 054
    Par défaut
    Je me demande si ça vaut pas le cout de faire un pipe, https://angular.io/guide/pipes
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
     
    @Pipe({ name: 'scoreCompute' })
    export class ScoreComputePipe implements PipeTransform {
     
      transform(items: impact[], computing: string): number {
        if (!items) {
          return 0;
        }
     
        var sum = items.reduce((a, b) => a.score + b.score);
        console.log(sum);
        return computing == "integers" ? Math.floor(sum) : parseFloat(sum.toFixed(1));
      }
    }
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    <div class="details">
      <h1>Session details</h1>
      <div class="computing">
        <h4>Select computing mode:</h4>
        <select [(ngModel)]="computing">
          <option value="decimals" selected>Decimals</option>
          <option value="integers">Integers</option>
        </select>
      </div>
      <div class="shotList">
        <table>
          <tr *ngFor="let shot of impacts | async">
            <td class="badge">{{shot.id}}: </td>
            <td> <strong> X:</strong>{{shot.x | number : '1.1-1'}}</td>
            <td><strong>Y:</strong>{{shot.y | number : '1.1-1'}}</td>
            <td><strong>Score : </strong>{{shot.score | number : '1.1-1' }}</td>
          </tr>
        </table>
      </div>
      <div class="score">
        <h4>Your total score :</h4>
        <div class="totalScore">
          {{impacts | async | scoreCompute:computing}}
        </div>
      </div>
    </div>

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    @Component({
      selector: 'app-impacts-list',
      templateUrl: './impacts-list.component.html',
      styleUrls: ['./impacts-list.component.css']
    })
    export class ImpactsListComponent implements OnInit {
     
      public impacts: Observable<Impact[]>;
      public score: number;
      public computing: string;
     
      constructor(private impactsService: ImpactsService) {
        this.score = 0;
        this.computing = "decimals";
      }
     
      ngOnInit(): void {
        this.impacts = this.impactsService.getImpacts();
      }
    }
    Que la magie soit, il y a surement quelque truc à modifier je peux pas tester de mon côté

  9. #9
    Membre confirmé
    Homme Profil pro
    Développeur Web
    Inscrit en
    janvier 2019
    Messages
    342
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 38
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : janvier 2019
    Messages : 342
    Points : 514
    Points
    514
    Par défaut
    Citation Envoyé par auloma Voir le message
    C’est malheureusement la première solution que j’aie essayée mais elle ne fonctionne pas :/
    le message d'erreur ? qu'est ce qui ne fonctionne pas ?


    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
     
    import { Component, OnInit } from '@angular/core';
    import { Impact } from '../impact';
    import { ImpactsService } from '../impacts.service';
     
     
    @Component({
      selector: 'app-impacts-list',
      templateUrl: './impacts-list.component.html',
      styleUrls: ['./impacts-list.component.css']
    })
    export class ImpactsListComponent implements OnInit {
     
      public impacts :Impact[];
      public score:number;
      public computing:string;
     
      constructor(private impactsService: ImpactsService) {
        this.impacts = [];
        this.score = 0;
        this.computing = "decimals";
      }
     
      getImpacts(): void {
        this.impactsService.getImpacts().subscribe(impacts => 
    {
    this.impacts = impacts
    this.compute();
    }
    );
      }
     
      compute(){
     
    console.log('impacts', this.impacts)
     
        if(this.computing == "integers"){
          this.score=0;
          for(var i=0; i<this.impacts.length;i++){
            this.score += Math.floor(this.impacts[i].score);
          }
     console.log('integers', this.score )
        } else {
          this.score=0;
          for(var i=0; i< this.impacts.length;i++){
            this.score += this.impacts[i].score;
          }
          this.score = parseFloat(this.score.toFixed(1));
     console.log('else ', this.score )
        }
      }
     
      ngOnInit(): void {
        this.getImpacts();
        this.compute();
      }
    }
    ça donne quoi les console.log ?

  10. #10
    Membre du Club
    Homme Profil pro
    Étudiant
    Inscrit en
    février 2020
    Messages
    54
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 21
    Localisation : France, Bas Rhin (Alsace)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : février 2020
    Messages : 54
    Points : 42
    Points
    42
    Par défaut
    Il n'y a aucun message d'erreur. En fait la variable score n'est juste pas modifiée et reste initialisée à 0.
    Les impacts sont parfaitement modifiés, je le vois car une liste d'impacts est mise-à-jour à chaque fois qu'un nouvel impact est reçu.
    En revanche la variable score vaut 0 et ne change pas à moins de modifier le select (voir html), qui va appeler a fonction compute(); Cette dernière ne semble même pas être appelée dans le subscribe de getimpacts().

  11. #11
    Membre du Club
    Homme Profil pro
    Étudiant
    Inscrit en
    février 2020
    Messages
    54
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 21
    Localisation : France, Bas Rhin (Alsace)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : février 2020
    Messages : 54
    Points : 42
    Points
    42
    Par défaut
    Citation Envoyé par youtpout978 Voir le message
    Je me demande si ça vaut pas le cout de faire un pipe, https://angular.io/guide/pipes
    Malheureusement il ne m'est pas possible d'utiliser un pipe : j'ai besoin de la somme des parties entières, qui n'est pas égale à la partie entière de la somme

  12. #12
    Membre confirmé
    Homme Profil pro
    Développeur Web
    Inscrit en
    janvier 2019
    Messages
    342
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 38
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : janvier 2019
    Messages : 342
    Points : 514
    Points
    514
    Par défaut
    Citation Envoyé par auloma Voir le message
    Il n'y a aucun message d'erreur. En fait la variable score n'est juste pas modifiée et reste initialisée à 0.
    Les impacts sont parfaitement modifiés, je le vois car une liste d'impacts est mise-à-jour à chaque fois qu'un nouvel impact est reçu.
    En revanche la variable score vaut 0 et ne change pas à moins de modifier le select (voir html), qui va appeler a fonction compute(); Cette dernière ne semble même pas être appelée dans le subscribe de getimpacts().
    et donc les 3 consoles, ça affiche quoi ?

  13. #13
    Membre du Club
    Homme Profil pro
    Étudiant
    Inscrit en
    février 2020
    Messages
    54
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 21
    Localisation : France, Bas Rhin (Alsace)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : février 2020
    Messages : 54
    Points : 42
    Points
    42
    Par défaut
    Cela n'affiche rien, compute ne semble pas être appelée malgré la ligne 28 du code que vous m'avez suggéré

  14. #14
    Expert confirmé

    Homme Profil pro
    Développeur .NET
    Inscrit en
    novembre 2010
    Messages
    2 002
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Rhône (Rhône Alpes)

    Informations professionnelles :
    Activité : Développeur .NET

    Informations forums :
    Inscription : novembre 2010
    Messages : 2 002
    Points : 4 054
    Points
    4 054
    Par défaut
    Citation Envoyé par auloma Voir le message
    Malheureusement il ne m'est pas possible d'utiliser un pipe : j'ai besoin de la somme des parties entières, qui n'est pas égale à la partie entière de la somme
    Tu peux reprendre ton code dans le pipe :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
     
    @Pipe({ name: 'scoreCompute' })
    export class ScoreComputePipe implements PipeTransform {
     
      transform(items: impact[], computing: string): number {
        if (!items) {
          return 0;
        }
     
    	let score=0;
    	  if(computing == "integers"){      
          for(var i=0; i<items.length;i++){
            score += Math.floor(items[i].score);
          }
     
        } else {
          for(var i=0; i< items.length;i++){
            score += items[i].score;
          }
          score = parseFloat(score.toFixed(1));
        }  
        console.log(score);
        return score;
      }
    }

  15. #15
    Membre du Club
    Homme Profil pro
    Étudiant
    Inscrit en
    février 2020
    Messages
    54
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 21
    Localisation : France, Bas Rhin (Alsace)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : février 2020
    Messages : 54
    Points : 42
    Points
    42
    Par défaut
    Merci à tous pour votre aide.
    J'ai réussi à m'en sortir avec un subject.

    Voici le code de ma solution, au cas où cela pourrait aider quelqu'un :

    le service :

    Code typescript : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
     
    import { Injectable } from '@angular/core';
    import { IMPACTS } from './mock-impacts';
    import { Impact } from './impact';
    import { Observable, of } from 'rxjs';
    import { WebSocketSubject } from 'rxjs/webSocket';
    import { Subject } from 'rxjs';
     
    export interface coordo {
      x:number;
      y:number;
    }
     
    @Injectable({
      providedIn: 'root'
    })
     
    export class ImpactsService {
     
      public ws: WebSocketSubject<coordo>;
      private impacts:Impact[];
      public scoreSubject: Subject<number>;
      private port:number = 1234;
     
      constructor() {
        this.scoreSubject = new Subject();
        this.impacts = [];
        this.ws = new WebSocketSubject ('ws://localhost:'+this.port);
        this.ws.subscribe( 
          (message) => {
            var impact:Impact = {
              id:this.impacts.length+1,
              x:message.x,
              y:message.y,
              score:(10.9 - ( Math.sqrt(Math.pow(message.x,2) + Math.pow(message.y,2))))
            }
            if(impact.score < 1.0)
              impact.score = 0.0;
            this.impacts.push(impact);
            this.scoreSubject.next(impact.score);
          },
          (err) => console.error(err)
        );
      }
     
      /**
       * function getImpacts()
       * 
       * returns the impacts array as an observable. 
       * 
       * @returns {Observable<Impact[]>}
       */
      getImpacts():Observable<Impact[]>{
        return of(this.impacts);
      }

    Le component :
    Code typescript : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
     
    import { Component, OnInit } from '@angular/core';
    import { Impact } from '../impact';
    import { ImpactsService } from '../impacts.service';
    import { Subscription } from 'rxjs';
     
     
    @Component({
      selector: 'app-impacts-list',
      templateUrl: './impacts-list.component.html',
      styleUrls: ['./impacts-list.component.css']
    })
     
    export class ImpactsListComponent implements OnInit {
     
      public impacts :Impact[];
      public score:number;
      public computing:string;
      public scoreSubscription:Subscription;
      public impactsSubscription:Subscription;
     
      constructor(private impactsService: ImpactsService) {
        this.impacts = [];
        this.score = 0;
        this.computing = "decimals";
        this.scoreSubscription = new  Subscription ();
        this.impactsSubscription = new  Subscription ();
      }
     
      /**
       * function getImpacts()
       * 
       * subscription to the value of the impactsService impacts array. Its value is used to update this.impacts. 
       * 
       * @returns {void}
       */
      getImpacts(): void {
        this.impactsSubscription = this.impactsService.getImpacts().subscribe(impacts => {
          this.impacts = impacts;
        });
      }
     
      /**
       * function getImpacts()
       * 
       * subscription to the impactsService scoreSubject property. The value it emits is added to this.score to update it.
       * 
       * @returns {void}
       */
      getScore ():void {
        this.scoreSubscription = this.impactsService.scoreSubject.subscribe(newScore => {
          if(this.computing == "integers"){
            this.score += Math.floor(newScore);
          } else {
            this.score += newScore;
          }
          this.score = parseFloat(this.score.toFixed(1));
        });
      }
     
      /**
       * function compute()
       * 
       * compute the total score in this.score according to the computing mode contained in this.computing,
       * using the impacts array.
       * This function is called when the user changes the value of the <select< object in the html part of this componnent.
       * 
       * @returns {void}
       */
      compute():void{
        if(this.computing == "integers"){
          this.score = 0;
          for(var i=0; i<this.impacts.length;i++){
            this.score += Math.floor(this.impacts[i].score);
          }
     
        } else {
          this.score = 0;
          for(var i = 0; i< this.impacts.length;i++){
            this.score += this.impacts[i].score;
          }
          this.score = parseFloat(this.score.toFixed(1));
        }
      }
     
      ngOnInit(): void {
        this.getImpacts();
        this.getScore();
      }
     
      ngOnDestroy():void{
        this.scoreSubscription.unsubscribe();
        this.impactsSubscription.unsubscribe();
      }
    }




    Mais j'ai désormais un autre soucis : Lorsque je lance mon projet, il ne se charge pas et j'obtiens l'erreur : "Uncaught Error: Type FormsModule does not have 'ɵmod' property." en console.
    Quelqu'a a-t-il déjà eu ce soucis ?

    Je suis revenu en arrière de plusieurs commits mais le problème persiste alors que tout fonctionnait jusqu'à maintenant.

  16. #16
    Membre émérite
    Avatar de dukoid
    Homme Profil pro
    Développeur informatique
    Inscrit en
    novembre 2012
    Messages
    1 991
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations professionnelles :
    Activité : Développeur informatique

    Informations forums :
    Inscription : novembre 2012
    Messages : 1 991
    Points : 2 817
    Points
    2 817
    Par défaut
    supprime le dossier : /node_module
    npm install

  17. #17
    Membre du Club
    Homme Profil pro
    Étudiant
    Inscrit en
    février 2020
    Messages
    54
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 21
    Localisation : France, Bas Rhin (Alsace)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : février 2020
    Messages : 54
    Points : 42
    Points
    42
    Par défaut
    Ça fonctionne ! 2h que je cherche le soucis ...
    Savez-vous d'où cela vient ?

  18. #18
    Membre émérite
    Avatar de dukoid
    Homme Profil pro
    Développeur informatique
    Inscrit en
    novembre 2012
    Messages
    1 991
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations professionnelles :
    Activité : Développeur informatique

    Informations forums :
    Inscription : novembre 2012
    Messages : 1 991
    Points : 2 817
    Points
    2 817
    Par défaut
    en re installant le dossier /node_module ça fonctionne donc ?


    je dirais qu'un virus te supprime des fichiers, un defaut du disque dur, une mauvaise manip .... je ne sais pas, les fichiers de ce dossier ne sont jamais modifiés ! étrange....

    5 ans d'Angular, ça m'est jamais arrivé !

  19. #19
    Membre du Club
    Homme Profil pro
    Étudiant
    Inscrit en
    février 2020
    Messages
    54
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 21
    Localisation : France, Bas Rhin (Alsace)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : février 2020
    Messages : 54
    Points : 42
    Points
    42
    Par défaut
    Oui ça a parfaitement fonctionné

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. modification de variable d'environnement (PS1)
    Par trax44 dans le forum Administration système
    Réponses: 3
    Dernier message: 28/05/2007, 18h52
  2. modification de variable
    Par sloshy dans le forum Général Python
    Réponses: 4
    Dernier message: 04/03/2007, 23h33
  3. modification des variables difine dans un movieclip
    Par 3adoula dans le forum Flash
    Réponses: 1
    Dernier message: 21/08/2006, 19h19
  4. [Tableaux] Suivre les modifications faits par chaque utilisateur
    Par dessinateurttuyen dans le forum Langage
    Réponses: 7
    Dernier message: 19/07/2006, 11h05
  5. Réponses: 3
    Dernier message: 01/09/2005, 12h56

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo