Angular 2: 将管道与 ngModel 结合使用
Angular 2: Using pipes with ngModel
我在我的一个表单中使用 JQuery inputmask 和 [(ngModel)]，但由于某些原因它们不能一起工作。单独使用其中任何一个都可以很好地工作，但是将这两个完全结合起来会中断 [(ngModel)] 并且新输入不会被发送回组件。在为此苦苦挣扎了一段时间后，我认为使用 Angular 2 的管道将是一个很好的解决方案，但是我也不知道如何让这两者一起工作。
这是我用来测试管道的一些代码
<input [(ngModel)]="Amount" id="Amount" name="Amount" class="form-control" type="number" autocomplete="off">
<p>Amount: {{Amount | number:'1.2-2'}}</p>
如果我输入 12345，下面的 <p> 标签将显示 12,345.00，这正是我希望它过滤的方式，但我不想让过滤后的数量低于输入，我想要输入本身显示 12,345.00。像这样将相同的管道添加到 ngModel：[(ngModel)]="Amount | number:'1.2-2'" 会出现以下错误。
Parser Error: Cannot have a pipe in an action expression at column 10
in [Amount | number:'1.2-2'=$event]
如何在 [(ngModel)] 的输入中使用管道（或输入掩码）？
[(ngModel)] 是 [ngModel] 和 (ngModelChange) 的缩写。如果你把它们分开它应该工作（它肯定适用于异步管道）：
[ngModel]="Amount | number: '1.2-2'" (ngModelChange)="updateAmount($event)"
我在我的一个表单中使用 JQuery inputmask 和 [(ngModel)]，但由于某些原因它们不能一起工作。单独使用其中任何一个都可以很好地工作，但是将这两个完全结合起来会中断 [(ngModel)] 并且新输入不会被发送回组件。在为此苦苦挣扎了一段时间后，我认为使用 Angular 2 的管道将是一个很好的解决方案，但是我也不知道如何让这两者一起工作。
这是我用来测试管道的一些代码
<input [(ngModel)]="Amount" id="Amount" name="Amount" class="form-control" type="number" autocomplete="off">
<p>Amount: {{Amount | number:'1.2-2'}}</p>
如果我输入 12345，下面的 <p> 标签将显示 12,345.00，这正是我希望它过滤的方式，但我不想让过滤后的数量低于输入，我想要输入本身显示 12,345.00。像这样将相同的管道添加到 ngModel：[(ngModel)]="Amount | number:'1.2-2'" 会出现以下错误。
Parser Error: Cannot have a pipe in an action expression at column 10 in [Amount | number:'1.2-2'=$event]
如何在 [(ngModel)] 的输入中使用管道（或输入掩码）？
[(ngModel)] 是 [ngModel] 和 (ngModelChange) 的缩写。如果你把它们分开它应该工作（它肯定适用于异步管道）：
[ngModel]="Amount | number: '1.2-2'" (ngModelChange)="updateAmount($event)"