Javascript 推入角度传感器无法产生预期结果

我刚学会推

我正在使用文本框向表中添加数据。并通过单击按钮，通过模板引用将其传递给组件

在组件中，我使用了textbox和push函数的值，但无法检索数据

HTML代码

<input type="text"  #userName >

<button (click)="addToTable(userName)">Add To Table</button>

<table>
    <tbody>
        <tr *ngFor="let u of users">
            <td>{{u.name}}</td>
        </tr>
    </tbody>
</table>

:

---

您需要在

用户

数组中推送值，而不是

selectedProduct

这里您推送selectedProduct并迭代用户，用html中的selectedProduct替换用户以获得预期结果。感谢您在@Shashank Vivek提供的解决方案

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

@Component({
  selector: 'app-ng-if',
  templateUrl: './ng-if.component.html',
  styleUrls: ['./ng-if.component.css']
})
export class NgIfComponent implements OnInit {

      selectedProduct=[];

      constructor() {
        this.selectedProduct;
      }

      addToTable(userName:any){
        this.selectedProduct.push(
          {name:userName.value}
          );
      }
      ngOnInit() {}
    }

export class AppComponent  {
  users = [
    {name: 'shan'}
  ]

  addToTable(data){
    this.users.push(
      {name: data.value}
    )
    data.value = ''
  }

}