Question

我不理解使用Typescript和Angular的这种行为。

我-component.html

  <ion-select [(ngModel)]="creditAmount"
              (ngModelChange)="onChangeCreditAmount()">
    <ion-option value="25" selected="true">25€</ion-option>
    <ion-option value="50">50€</ion-option>
    <ion-option value="75">75€</ion-option>
    <ion-option value="100">100€</ion-option>
  </ion-select>

我-component.ts

  creditAmount: number;

  constructor() {
    this.creditAmount = 25;
    console.log(this.creditAmount);
  }
  onChangeCreditAmount() {
    console.log(this.creditAmount);
  }

在构造函数中，creditAmount是一个数字。在onChangeCreditAmount方法中，它变成了一个字符串。

我找到的唯一解决方法是使用显式强制转换：Number(this.creditAmount)但这对我来说似乎很骇人听闻。有没有更好的办法？感谢。

Answer 1

Typescript只对编译时有帮助。结果仍然是一些JavaScript，这不是类型安全的。因此，您可以为creditAmount分配一个数字，一个字符串，一个数组或任何您喜欢的内容。

NgModel似乎仅适用于字符串，因此如果需要数字，则必须解析它。对不起： - （

Answer 2

另一种（可能是hacky）方式是使用+运算符，方法如下：

const str = '10';
const dig = +str;

console.log(str + ', ' + typeof str);
console.log(dig + ', ' + typeof dig);

输出：

10, string
10, number

number使用NgModel绑定

2 个答案: