web-dev-qa-db-fra.com

Angular - La valeur de clé du canal est introuvable

Je teste le tube keyvalue d'Angular avec du code simple:

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

@Component({
  selector: 'app-root',
  template: `<div *ngFor="let prop of testObj | keyvalue">
      <div>key: {{prop.key}}</div>
      <div>value: {{prop.value}}<div>
    </div> `
})
export class AppComponent {
  testObj = { id: 1, name: "Abdul Rafay" }
}

mais ça me donne cette erreur:

Erreurs d'analyse de modèle: le canal 'keyvalue' est introuvable ("] prop of testObj | keyvalue"> key: {{prop.key}} value: {{prop.value}} "): ng: /// AppModule /AppComponent.html@0:17 Évaluation de l'application de démarrage src/main.ts

est-ce que je manque quelque chose? Voici mon Stackblitz

8
Abdul Rafay

Votre code est très bien. Vous avez juste besoin de mettre à jour vos dépendances vers 6.1 pour utiliser le tube keyvalue.

Stackblitz ici

13
Developer

Le canal KeyValue est disponible en angular 6.1 pour mettre à jour vos dépendances cela fonctionnera

Si vous utilisez angular 6 vous pouvez essayer ceci

[~ # ~] html [~ # ~]

  <div *ngFor="let prop of key">
          <div>key: {{prop}}</div>
          <div>value: {{testObj[prop]}}<div>
        </div> 

[~ # ~] ts [~ # ~]

 testObj = { id: 1, name: "Abdul Rafay" }
    get key(){
      return Object.keys(this.testObj);
    }

Exemple: https://stackblitz.com/edit/angular-6-template-x9hady

5
Chellappan