Question

我想将2个简单的输入字段绑定到Angular中的1个单击事件。一个框应该是输入文本的正常输入，另一个框将提供时间戳Date();。如何使用按钮上的单击事件显示这两个值？

// input #date offers the timestamp timestamp

<input #date type="text" placeholder="now">
<input #text type="text">
<p><b>{{now}}</b> {{values}}</p>
<button class="btn btn-primary" (click)="values=box.value | text.value">Log Data</button>

Answer 1

我必须猜测你的意图，但如果你想捕获两个输入，为什么不使用直接模型绑定（需要导入FormsModule）？

HTML：

<input #date type="text" placeholder="mm/dd/yyyy" [(ngModel)]="dateToLog">
<input #text [(ngModel)]="textToLog" type="text">
<div *ngIf="logValues">
<p *ngFor="let val of logValues"><b>{{val | json}}</b></p>
</div>
<button class="btn btn-primary" (click)="logValue()">Log Data</button>

打字稿：

logValues: any = [];
dateToLog: string = "";
textToLog: string = "";

logValue(): void {
   let d = new Date(Date.parse(this.dateToLog));

   let len = this.logValues.length;

   let name1 = ("date_" + len);
   let name2 = ("text_" + len);

   let x = { };
   x[name1] = d;
   x[name2] = this.textToLog;
   this.logValues.push(x);
   this.dateToLog = "";
   this.textToLog = "";
}

用于将2个对象绑定到1个事件的Angular 2语法

1 个答案: