Impossible de manipuler les données à l'aide de la directive ngFor

Question

Ceci est mon fichier ts.

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

@Component({ 
    selector: "my-app", 
    templateUrl: './app.component.html', 
    styleUrls: ['./app.component.css'] 

}) 
export class AppComponent { 
    employees: [ 
     { name: "ABC", position: "Programmer" }, 
     { name: "CDF", position: "HR" } 
    ]; 
} 

ici il est mon fichier html

<h3>List Of Records </h3> 

<table> 
    <thead> 
     <tr> 
      <th>Name</th> 
      <th>Position</th> 
      <th>Actions</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr *ngFor="let emp of employees "> 
      <td>{{emp.name}}</td> 
      <td>{{emp.position}}</td> 
      <td> 
       <input type="submit" id="edit" value="Edit"> 
       <input type="submit" id="delete" value="Delete"> 
      </td> 
     </tr> 
    </tbody> 
</table> 

Je ne sais pas pourquoi je suis incapable d'obtenir ces deux propriétés dans ma table. et aussi je suis incapable d'obtenir les boutons éditer et supprimer. mais quand je retire la directive ngFOr que je suis en mesure de voir ces deux boutons

Answer 1

Le bon est

employees = [ 
    { name: "ABC", position: "Programmer" }, 
    { name: "CDF", position: "HR" } 
]; 

Vous utilisez « : » ce qui signifie que vous définissez le type de la propriété des « employés ». Vous devez utiliser l'opérateur '=' pour définir sa valeur.

Answer 2

vous pouvez utiliser ":" ceci est la syntaxe correcte

employees:Array<object> = [ 
    { name: "ABC", position: "Programmer" }, 
    { name: "CDF", position: "HR" } 
    ];