Связывание вычисленного свойства в текстовом вводе с Ember.js

Question

Я использую ответ от Bindings Computed Property in Ember TextField, но хотел бы, чтобы он немного расширился.

Вот мой шаблон:

{{input id="dollars" name="dollars" value=formattedDollars class="form-control"}} 

И в мой контроллер:

formattedDollars: function(key, value) { 
    var model = this.get('model'); 
    if(value) { 
     //This is the setter--make sure the stored value is an integer 
     model.set('dollars', +value.toString().replace(/[^\d]/, "")); 
    } else { 
     //This is the getter--return a formatted value 
     return model.get('dollars').toString().replace(/\B(?=(\d{3})+(?!\d))/g, ","); 
    } 
}.property('model.dollars') 

Это работает, если я устанавливаю formattedDollars вне текстового поля (например, model.incrementProperty('dollars', 10)), но если я на самом деле типа в текстовый ввод, значение не остается форматированным.

Я попытался также вернуть value.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") в сеттер, но это тоже не сработало. Как я могу сделать это так, чтобы ввод в поле ввода dollars автоматически форматировал число?

Answer 1

Вы должны вернуть значение в обоих случаях - при получении или настройке вычисленного свойства. Так что ваш код должен быть:

formattedDollars: function(key, value) { 
 
    var model = this.get('model'); 
 
    if(arguments.length > 1) { 
 
     //This is the setter--make sure the stored value is an integer 
 
     model.set('dollars', +value.toString().replace(/[^\d]/, "")); 
 
    } 
 
    //This is the getter--return a formatted value 
 
    return model.get('dollars').toString().replace(/\B(?=(\d{3})+(?!\d))/g, ","); 
 
    
 
}.property('model.dollars')