Ember 观察者未更改字段值

Question

所以我是 Ember 的新手，一段时间以来一直在四处寻找答案。

我有一个字段，我想限制空格的使用（基本上如果用户点击空格键，我不希望它做任何事情）。

问题是，我仍然可以按空格键并添加多个空格，直到我按另一个字符，该值才失去所有空格（为了帮助描述，我没有交换空格，而是将交换字母 'a').

到目前为止我有一个观察者和一个函数（在我的组件 js 文件中）：

emailChanged: Ember.observer('email', function() {
  // console.log('email changed');
  Ember.run.once(this, 'formatEmail');
}),

formatEmail() {
   // console.log('email', this.get('email')); 
   this.set('email', this.get('email').replace(/a/g, ''));
  // console.log('should be', this.get('email'));
},

所以发生的事情是（当我使用控制台日志时）。

如果我在控制台中输入 'b' 字符，我会得到 email changed，然后是 email b，然后是 should be b。

当我键入 'a' 时，在控制台中我得到 email changed 然后 email ba，然后 formatEmail() 实际上运行并更改了电子邮件，所以我得到 should be b, email b, should be b.

但是还是显示'ba'。

很难解释这一点，但基本上，看起来 set 正在工作，只是它没有改变屏幕上显示的内容。

Ember-twiddle

Answer 1

Ember Twiddle 上的工作演示。

我已经稍微更改了您的输入以通过操作而不是双向绑定来处理电子邮件更改：

<input id='email' value={{email}} oninput={{action 'emailInput'}} />

然后在您的组件中，我添加了一个操作：

actions: {
    emailInput(event) {
        const $input = $(event.target);
        const value = $input.val();
        const withoutSpaces = value.replace(/\s+/g, '');

        this.set('email', withoutSpaces);
        $input.val(withoutSpaces);
    }
}

这里的关键功能是使用.val()设置输入值：

$input.val(withoutSpaces);

没有它，输入中的值将不会改变。

Ember 观察者未更改字段值

Ember observer not changing field value

javascript

ember.js