KeyPress事件在Ember中无法正常工作

Question

我想做的是，每当用户停止在“项目名”字段中输入内容时进行一次ajax调用，并对照数据库进行检查，并显示一条错误消息，指出“它存在”。但是keypress事件不能按预期方式工作，首先它会忽略输入的第一个字母，结果单词没有完全发送到数据库。

这是我的Controller：

App.ProjectController = Ember.ArrayController.extend({
    actions : {
        createNew : function() {
            data = {
                projectname : this.get('projectname'),
                projectdesc : this.get('projectdesc'),
                projectbudget : this.get('projectbudget'),
            };
            console.log(JSON.stringify(data));
            //console.log(id);
            $.ajax({
                type : "POST",
                url : "http://ankur.local/users/createNewProject",
                data : data,
                dataType : "json",
                success : function(data) {
                    console.log('success');
                    //alert('');
                }
            });
            alertify.success("Project Created");
            this.set('projectname', "");
            this.set('projectdesc', "");
            this.set('projectbudget', "")
            return false;
        },
        checkName: function(){
            data = {
                projectname : this.get('projectname'),
            };
            var checkedName = $.ajax({
                type : "POST",
                url : "http://ankur.local/users/checkProjectName",
                data : data,
                dataType : "json",
                success : function(data) {
                    console.log('Yes it');
                }
            });
            console.log(data);
            console.log(checkedName);
        }
    }


});

这是HTML，

<script type="text/x-handlebars" id="project">
<div class="row" style="padding-left: 30px">

        <div class="span12" id="form-container">
            <div class="well well-small">
                <p style="text-align: center">
                    You can create a new Project by filling this simple form.
                </p>

                <p style="text-align: center"> Project Name should be minimum 10 characters &amp; maximum 50 characters.
                    Project Description
                    10 to 300 characters.
                </p>
            </div>
            <div class="row" id="test">
                <div class="offset3 span8">
                    <form class="form-horizontal" id="projectform">
                        <div class="control-group">
                            <label class="control-label" for="projectname">Project Name: </label>

                            <div class="controls">
                                {{view Ember.TextField valueBinding='projectname' style="max-width: 100%" onEvent="keyUp" action=checkName}}
                            </div>
                        </div>
                        <div class="control-group">
                            <label class="control-label" for="projectdesc">Project Description:</label>

                            <div class="controls">
                                {{view Ember.TextArea valueBinding='projectdesc' style="max-width: 100%"}}
                            </div>
                        </div>
                        <div class="control-group">
                            <label class="control-label" for="projectbudget">Project Budget($)</label>


                            <div class="controls">
                               {{view Ember.TextField valueBinding='projectbudget' id="budget" style="max-width: 100%"}}
                            </div>

                        </div>
                        <div class="control-group">
                            <div class="controls">
                                <button class="btn"
                                {{action 'createNew' }}>Add Project</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
        </div>

我可以做出哪些改进才能达到预期的效果？

Answer 1

按键工作正常，在文本框值更改之前进行按键操作。

看起来您所需要的方式不支持按键。幸运的是，它很容易覆盖：

App.KeyUpTextField = Em.TextField.extend({
  keyUp:function(event){
    this.sendAction('upKeyAction', event); 
  }
});


{{view App.KeyUpTextField value=projectname upKeyAction='checkName'}}

顺便说一句，我会在您的keyUp函数中进行反跳或类似操作，似乎在每个keyup事件上发送请求都会有点chat不休。