Controller的属性未显示在模板上

Question

我有一个用作用户注册页面的模板.它有电子邮件,密码,密码确认,名字和姓氏.然后,有一个按钮,它应该调用在控制器中定义的动作.把手模板看起来像这样.

<div class="well">

    <form role="form">
        <div class='form-group'>
            {{input type='email' class='form-control' placeholder='E-Mail' value=email}}
        </div>

        <div class='form-group'>
            {{input type='text' class='form-control' placeholder='First Name' value=password}}
        </div>

        <div class='form-group'>
            {{input type='text' class='form-control' placeholder='Last Name' value=password}}
        </div>

        <div class='form-group'>
            {{input type='password' class='form-control' placeholder='Password' value=password}}
        </div>

        <div class='form-group'>
            {{input type='password' class='form-control' placeholder='Password Confirmation' value=passwordConfirmation}}
        </div>

        <button {{action 'signUp'}} class='btn btn-lg btn-default'>Sign Up</button>
    </form>

</div>

现在,每当出现验证错误(例如丢失电子邮件)时,我想在同一页面上呈现错误.为此,我在我的操作中有基本的验证规则,除此之外,还定义了另一个名为的属性signUpError.我的控制器看起来像这样.

Postr.SignUpController = Ember.Controller.extend({
    actions: {
        signUp: function(){

            var email = this.get('email');
            var password = this.get('password');
            var passwordConfirmation = this.get('passwordConfirmation');
            var firstName = this.get('firstName');
            var lastName = this.get('lastName');

            console.log(email);

            if(!email || !password || !passwordConfirmation || !firstName || !lastName){
                this.set('signUpError ', 'One or more field is missing!');
            }
            if(password !== passwordConfirmation){
                this.set('signUpError ', 'Password does not match!');
            }

            //console.log(this.get('signUpError'));
        }
    },

    signUpError: ''
});

并且,在表单的顶部,我添加了一个新的HTML元素来呈现错误.

{{#if signUpError}}
    <div class="alert alert-danger">
        {{signUpError}}
    </div>
{{/if}}

问题是......我无法signUpError表现出来:| 有任何想法吗？

多谢你们.

Answer 1

问题是你的this.set('signupError')有一个空格,所以你实际上并没有正确设置属性.

我在jsbin中重新创建了这个问题,如果没有空间,问题就可以了.

this.set('signUpError', 'Password does not match!');

http://emberjs.jsbin.com/hicefefibe/1/