Question

所以我是Ember的新手，并且在寻找答案的过程中一直在做一些挖掘。

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

问题是，我仍然可以点击空格键并添加多个空格，直到我点击另一个字符时值才会丢失所有空格（为了帮助这个描述，而不是交换空格，我和＃39;我要换掉这封信＆＃39; a＆＃39;）。

到目前为止，我有一个观察者和一个函数（在我的组件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'));
},

所以发生了什么（当我使用控制台日志时）。

如果我输入＆＃39; b＆＃39;我得到的控制台中的字符为email changed，然后是email b，然后是should be b。

当我输入＆＃39; a＆＃39;时，我会在控制台中email changed然后email ba，然后formatEmail()实际运行并更改电子邮件，然后我获得{ {1}}，should be b，email b。

但它仍在显示＆＃39; ba＆＃39;

很难解释这一点，但基本上，看起来套装是有效的，除了它没有改变屏幕上显示的内容。

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);

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

灰烬观察者不改变场值

1 个答案: