如何选择任何数量并改变它的价值？

Question

我是 ionic 3 的新手，想了解代码，请帮帮我。 我想选择任何项目，它的值得到的更改小计可能会反映到它的输出。

cart.ts

private _values1 = [" 1 ", "2", " 3 "," 4 "," 5 "," 6 "];

  firstDropDownChanged(_values1: any) 
  {
    this.currentPrice = (parseInt(this.product.subtotal) * this._values1);
    console.log(this.currentPrice);
    this.product.subtotal =this.currentPrice;
    console.log(this.product._values1);
  }

cart.html

  <span style="font-size: 14px !important;">Qty:</span>   
  <select class="sel" (change)="firstDropDownChanged()">
  <option *ngFor='let v of _values1'>{{ v }}</option>
  </select>

Answer 1

您可以使用[(ngModel)] as 来使用 2 路数据绑定

<select class="sel" (change)="firstDropDownChanged()" [(ngModel)]="selectedValue">
        <option *ngFor='let v of _values1' [ngValue]="v">{{ v }}</option>
 </select>

因此，在每次更改选项时，所选选项的当前值将在 selectedValue 变量中。在.ts 文件中用作

firstDropDownChanged() {
   this.currentPrice = this.product.subtotal * this.selectedValue;
    console.log(this.currentPrice);
    this.product.subtotal =this.currentPrice;
  }

Stackblitz Demo using ngModel

Answer 2

在 TS 中试试这个

    this.currentPrice = this._values1.map((value: number) => { 
      return parseInt(this.product.subtotal) * value 
    });

在 HTML 中添加下面的 Select

(change)="firstDropDownChanged($event.target.value)"

Answer 3

你可以试试这样，希望对你有帮助

TS

currentPrice: number = 0;
private _values1 = [" 1 ", "2", " 3 "," 4 "," 5 "," 6 "];

firstDropDownChanged(data: any) 
{
  this.currentPrice = +this.product.subtotal * +data.target.value;
  console.log(this.currentPrice);
  this.product.subtotal = this.currentPrice;
}

HTML

  <select class="sel" (change)="firstDropDownChanged($event)">
    <option *ngFor='let v of _values1'>{{ v }}</option>
  </select>

让我知道它是否有效

Answer 4

您需要在您的firstDropDownChanged() 方法中使用$event.target.value 传递所选值，如下所示

component.ts

private _values1 = [1, 2,3, 4, 5, 6];
 currentPrice = 10;
 product = {
   subtotal : 10,
   _values1 : 1
 }
  firstDropDownChanged(_values1: any) {
   this.currentPrice = this.product.subtotal * _values1;
    console.log(this.currentPrice);
    this.product.subtotal =this.currentPrice;
    console.log(this.product._values1);

  }

component.html

  <select class="sel" (change)="firstDropDownChanged($event.target.value)">
        <option *ngFor='let v of _values1'>{{ v }}</option>
      </select>

Here is stackblitz link

希望这会有所帮助！