Question

我正在试图找出如何在一个地方处理“登录”操作，必须通过点击按钮激活并“输入”按键;

在我的模板中，我将所有内容都包含在“登录功能”组件

中

//template home.hbs
{{#login-functions}}     
    <input id="email" type="email" class="validate">
    <input id="password" type="password" class="validate">

    <div id="login" {{action "login"}}>     
{{/login-functions}}


//component components/login-functions.js
export default Ember.Component.extend({
    actions: {
        login: function() {
            var email = $('#email').val();
            var password = $('#password').val();
            var self = this;

            Utils.login(email, password).done(function(res) {
                localStorage.setItem('Access-Token', res.data.token);
                localStorage.setItem('userId', res.data.user_id);
                self.transitionToRoute('feed');
            })
            .error(function(error) {
                //handle error
            });
        }
    },

    keyPress: function(event) {
        if (event.charCode === 13) {
            console.log('login attempt');
            this.send('login');            
        }
    }
});

但是这不起作用，因为动作不是从模板按钮发送到组件的动作，也是因为从组件我无法执行转换。

有人能说出最好的办法吗？

Answer 1

我认为这是因为您的按钮是home模板的一部分。也许表单应该移到您的login-functions模板中，并通过home从您的{{login-functions}}模板中调用。

对于重定向，组件无法执行这些操作，我建议使用this.sendAction('didLogin')调用操作并处理HomeController中的重定向。

Answer 2

将keyPress个功能移出行动。

更新---这是一个有效的demo

从Ember的组件内发送动作

2 个答案: