angular 如何在不提交的情况下输入和 select 值 return 结果

Question

angular 如何在不提交的情况下输入和 select 值 return 结果我有最新的货币转换器表格 api

<form [formGroup]="newForm" (ngSubmit)="convert()">
        <div>

            <h1>
                Currency
            </h1>
            <div>

                <input type="number" formControlName="amount1">

                <select id="from" formControlName="from">
         <option value="" disabled>Choose currency</option>
        <option value="{{ m.code }}" *ngFor="let m of rates" >{{m.code}}</option>
    </select>
            </div>
            <div>

                <input type="number" [value]="name">

                <select id="to" formControlName="to">
         <option value="" disabled>Choose currency</option>
        <option value="{{ m.code }}" *ngFor="let m of rates" >{{m.code}}</option>
    </select>
            </div>
            <button type="submit" [disabled]="!newForm.valid"> Convert </button>
        </div>
    </form>

例如，要从美元转换为欧元，请在“amount1”中输入一个数字，然后 return 将其转换为。如何在没有提交按钮的情况下自动 returns 结果，如果我更改数字它会自动更改

Answer 1

您可以通过在 ngOnInit 方法中订阅 valueChanges 属性来检测表单值更改。

 this.newForm.get('amount1').valueChanges.subscribe((val) => {
  this.name = val;
});

angular 如何在不提交的情况下输入和 select 值 return 结果

angular how input and select value return result without submit

javascript

angular

typescript

currency

converters