从Angular2的货币掩码输入中获取值

Question

我在表单的输入内使用了maskMoney jquery插件。当我想从这些输入字段获取数据时，它是空的！

这里是我的MaskMoney指令：

import {Directive, ElementRef} from "@angular/core"; 
declare var $: any; 

@Directive({ 
    selector: '[money]' 
}) 
export class CurrencyMaskDirective { 
    constructor(public el: ElementRef) { 
    let native = el.nativeElement; 
    $(native).maskMoney({ 
     suffix: " $", 
     thousands: '،', 
     decimal: '', 
     precision: 3, 
     affixesStay: false 
    }); 
    } 
} 

这里是我的形式：

<form role="form" #f="ngForm" (ngSubmit)="addcharge(f)" novalidate> 
    <input type="text" name="value" #value="ngModel" ngModel money> 
</form> 

// in ts file 
addcharge(g) { 
    console.log(g.value); 
} 

当我登录该值在控制台空！我怎样才能正确地从输入中获得价值？

谢谢。

Answer 1

您DONOT需要一个单一的输入我觉得形式这应该做工精细

<div> 
    <input type="text" name="value" #titleInput money> 
    <button type="submit" (click) = 'addTodo(titleInput.value)'>Add</button> 
</div> 


    addTodo(title:string) { 
    console.log(title); 
    } 

如果你需要寻找到具有反应活性或模板驱动的形式，你可以看看@这个页面的例子

https://rahulrsingh09.github.io/AngularConcepts/#/reactive

https://rahulrsingh09.github.io/AngularConcepts/#/template

更新

入住此Plunker链接

https://plnkr.co/edit/oicEbx5HQj3T208GCuU7?p=preview

Answer 2

我认为你必须分配ngModel在HTML视图如下面的代码。

<form role="form" #f="ngForm" (ngSubmit)="addcharge(f)" novalidate> 
    <input type="text" name="value" #value="ngModel" [(ngModel)]="moneyValue" money> 
</form> 

// in ts file 
moneyValue: string = null; 
addcharge(g) { 
    console.log(this.moneyValue); 
}