1
votes

Comment utiliser la carte et attribuer la valeur

J'ai une liste de livres, avec IsEnable par défaut sur False. Je dois vérifier chaque livre s'il est activé ou non dans onInit (). J'ai pensé à ajouter une carte rxjs et à appeler la fonction getEligibleBooks () à l'intérieur de la carte, mais comment attribuer la valeur de retour true ou false dans IsEnable?

Books.ts

export class Book{
Name:string;
IsEnable:boolean;
}

books.component.ts

...
books = Observable.of([{"Name":"A", "IsEnable":"False"},{"Name":"B", "IsEnable":"False"}]);
...
getEligibleBooks(book){
//complex logic
return result; //true or false
}
...
ngOnInit(){
this.books.pipe(
    map( book => this.getEligibleBooks(book)) // have no idea how to achieve it
  ).subscribe(data=>console.log(data));
}

typescript angular rxjs

2 commentaires

Utilisez le filtre au lieu de la carte

Je ne veux pas le filtrer.

3 Réponses :

0
votes

Vous pouvez essayer ceci

this.books.pipe(
    map( book => {
     book.IsEnable = this.getEligibleBooks(book); 
     return book
    }) 
).subscribe( data => console.log(data) );

4 commentaires

map (book => ({... book, IsEnabled: this.get Eligible Books (book)}))

Cela crée une nouvelle propriété IsEnabled, je dois attribuer la valeur booléenne pour IsEnabled de chaque livre.

@RanjithVaradan c'est presque correct, il suffit de faire map (book => {book.IsEnabled = this.getEligibleBooks (book); return book})

@RanjithVaradan J'ai modifié ma réponse en fonction du commentaire ci-dessus de xyz

0
votes

Les Rxjs de l'opérateur diffusent la table entière en même temps. L'opérateur de carte Rxjs mappe la table entière à la nouvelle sortie. Lorsque vous souhaitez modifier les éléments du tableau, vous devez également utiliser la fonction js map pour faire muter la table entière en vérifiant tous les éléments du tableau séparément.

this.books.pipe(
      map(
        books => books.map( book => { ...book, IsEnable: this.getEligibleBooks(book) })),
    ).subscribe(data => console.log(data));

0 commentaires

1
votes

Comme vous ne changez pas le type renvoyé nulle part, il n'est pas nécessaire d'utiliser map . Il semble que tout ce que vous voulez faire est de parcourir le résultat retourné et éventuellement de définir un membre sur une instance de livre. Dans ce cas, utilisez appuyez sur au lieu de carte . map est utile lorsque vous souhaitez transformer l'entrée en une sortie différente.
Le code doit faire une distinction entre un tableau et un objet lors de l'exécution d'une opération. Cela devient plus facile à voir lorsque vous définissez les types attendus dans vos signatures de méthode pour les entrées (arguments de méthode) et le type de retour. Il en va de même pour la dénomination des arguments, utilisez la forme plurielle pour les tableaux et la forme singulière pour les types non-tableau. Dans ce cas, utilisez livres et livre .
Je recommanderais d'utiliser une interface sur une classe car vous n'avez pas de comportement défini. C'est plus simple lors du mappage de json analysé à un type.
Notez que les valeurs booléennes constantes sont true et false , n'affectez pas "True" / "False" code> car ce sont des chaînes littérales et non des valeurs booléennes. Si vous faites une comparaison véridique sur "False" , il sera évalué à true

books: IBook[];

getBooksAsync() : Observable<IBook[]> {
  return Observable.of([{"Name":"A", "IsEnable":false},{"Name":"B", "IsEnable":false}] as IBook[]);
}

isBookEligible(book: IBook): boolean {
  return true; // hard coded for now because there is no implementation
}

ngOnInit(){
    this.getBooksAsync.pipe(
        tap((books) => {
            books.forEach((book) => book.IsEligible = this.isBookEligible(book));
        })
    ).subscribe(books => this.books = books);
}

books.component.ts

export interface IBook{
    Name:string;
    IsEnable:boolean;
    IsEligible?:boolean|undefined;
}

0 commentaires