Question

在加载页面时，会调用API，该API返回一个JSON，该JSON具有深度嵌套的数组，可以通过ngFor在HTML中对其进行访问。

值是一个数字，它会自动删除尾随的零。我的目标是重新添加尾随零。

HTML如下：

 <th>
   <input type="number" step="any" class="input-padding input-box modal-input" [(ngModel)]="segment.number">
 </th>

我尝试使用(change)，它在加载ngModel时会触发，但是我无法将值重置为尾随零。

Answer 1

编辑：

如果您想屏蔽ngModel属性的值，则可以这样做

this._segment = this.decPipe.transform(value, '1.2')使用您的segment设置方法。

因此，您需要为setter/getter属性添加segment，以进行自动转换。

export class AppComponent  {
 private _segment;

  get segment () {
     return this._segment;
  }

  set segment(value){
   this._segment = this.decPipe.transform(value, '1.2')
  }

  constructor(private decPipe : DecimalPipe){
    this.segment = '15.2'
  }
}

DEMO

原始答案：

如果我正确理解了您的问题，则要显示带有两位数字的number decimal。您可以为此使用number管道

<input type="number" value="{{segment | number: '1.2'}}" >

Answer 2

之所以发生，是因为这是一个数字。请改用字符串 （“ 0123”）

从NgFor加载NgModel时屏蔽值

2 个答案: