亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

在 Angular 中添加兩個不同的輸入以列出的 TypeScript 代碼是什么?

在 Angular 中添加兩個不同的輸入以列出的 TypeScript 代碼是什么?

瀟瀟雨雨 2022-07-08 10:50:25
我創建了一個表單來將 2 個不同的輸入(姓名和年齡)添加到列表中。但是我在打字稿文件中編碼時遇到問題。將項目添加到列表的方法是什么?我已經編寫了我的html和typescript文件的代碼。我在我的 Button 中創建了函數(onClick),那么我應該在這個函數中編寫什么代碼來在列表中添加項目?我還在html代碼中編寫了 ngRepeat指令,但我不知道如何在typecipt文件中使用它。html代碼:<div class="shadow-lg p-5 mb-5 bg-white rounded">    <ul class = "list-group">        <li *ngFor="let person of people" class = "list-group-item list-group-item-success">            {{ person.name }} - {{ person.age }}        </li>    </ul>    <br/>    <ul class = "list-group">        <li class = "list-group-item list-group-item-warning">            <input type="name" class="form-control ng-untouched ng-pristine ng-valid" placeholder="Enter Name" [(ngModel)]="name" ngRepeat="detail in people">   <hr/>            <input type="number" class="form-control ng-untouched ng-pristine ng-valid" placeholder="Enter Age" [(ngModel)]="age" ngRepeat="detail in people">  <hr/>            <button type="button" class="btn btn-danger btn-block" (click)="onClick()"> Add </button>        </li>    </ul></div>打字稿代碼:import { Component, OnInit } from '@angular/core';@Component({  selector: 'app-menu',  templateUrl: './menu.component.html',  styleUrls: ['./menu.component.css']})export class MenuComponent implements OnInit {  name: string;  age: number;  people: any[] = [{    "name" : "abdul",    "age" : 20  }, {    "name" : "david",    "age" : 30  }, {    "name" : "ben",    "age" : 40  }]  onClick() {    this.people.push();  }  constructor() { }  ngOnInit(): void {  }}
查看完整描述

1 回答

?
滄海一幻覺

TA貢獻1824條經驗 獲得超5個贊

只需更改您的推送:

onClick() {  this.people.push({ name: this.name, age: this.age });}

演示:

https://stackblitz.com/edit/angular-p3hkex


查看完整回答
反對 回復 2022-07-08
  • 1 回答
  • 0 關注
  • 112 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號