bugfix> angular > 投稿

これがなぜ起こるのかについてのアイデアngFor内で生成されるテキストボックスがいくつかあります。

   <tr *ngFor="let tableRow of lineItems; trackBy:trackByIndex; let rowIndex = index; ">     
      <td class="psavingsSmallerGridCell"><input currencyMask [(ngModel)]="tableRow.existingCost" [attr.disabled] = "shouldExistingChargeBeReadOnly(tableRow)"/></td>
      <td class="psavingsSmallerGridCell"><input currencyMask [(ngModel)]="tableRow.projectedCost" /></td>
      <td class="psavingsSmallerGridCell"><input currencyMask [ngModel]="tableRow.actualCost" disabled /></td>

console.loggedでモデルのlineItems配列が正確であることを確認しましたが、何らかの理由でChromeの[戻る]ボタン(バージョン66.0.3359.181(公式ビルド)64ビット)を使用すると、入力にバインドされた値がすべて取得されますジャッキアップした。私が試したブラウザのうち、これまでのところChromeだけがこの動作をしています。

乱れたレンダリングの画像

問題の原因としてそれを排除するために、currencyMaskサードパーティのディレクティブを削除してみました。

開発ツールでDOMを調べると、めちゃくちゃになったボックスのng-reflect-model属性に正しい値が割り当てられており、入力テキスト値自体が間違っていることがわかります。

回答 1 件
  • これは結局、Angularではなく、Chromeの動的フォームの処理に関係するようになりました。フォーム要素でautocomplete = offを設定すると、問題が修正されました。

あなたの答え