查看绑定Emberjs

use*_*992 2 ember.js

我有一个简单的应用程序,您可以登录它看起来像这样:

{{#view App.mainV}}
  {{#if logged}}
     Hey!
  {{else}}
  <!-- Login form here when clicked: App.mainC.login()-->
  {{/if}}
{{/view}}
Run Code Online (Sandbox Code Playgroud)

这是样本控制器:

App.mainC = Ember.ArrayController.create({
    login: function(){
        if(ok)//Everything went fine
            App.mainV.logged = true;
    }
});
Run Code Online (Sandbox Code Playgroud)

这是mainV:

App.mainV = Ember.View.extend({
    logged: false,
    test: function()
    {
        console.log('JO');
    }
});
Run Code Online (Sandbox Code Playgroud)

关于这个应用,我有两个问题:

  • 为什么当我更改记录到真实视图时不会改变?
  • 如果我调用App.mainV.test(),我会收到错误.为什么?

    TypeError:'App.mainV.test'不是函数

Sté*_*ond 7

如果要从模板访问视图的属性,则必须以"视图"作为前缀.在你的例子中:{{#if view.logged}}.

你不能这样做,App.mainV.test()因为App.mainV是一个类,而不是一个实例.你可以做到App.mainV.create().test().

你应该重命名App.mainVApp.MainV符合Ember.js约定(类名应该大写,参见http://www.emberist.com/2012/04/09/naming-conventions.html)

编辑:

您的示例中还有另一个问题:控制器尝试修改视图中的值.在Ember方式中,您应该将视图的属性绑定到控制器.控制器中的任何更改都将传播到视图:

<script type="text/x-handlebars">
{{#view App.MainView}}
    {{#if view.logged}}
        Hey!
    {{else}}
        <!-- Login form here when clicked: App.mainController.login()-->
    {{/if}}
{{/view}}
</script>?

App = Ember.Application.create();

App.mainController = Ember.Controller.create({
    logged: false,
    login: function() {
        this.set('logged', true);
    }
});

App.MainView = Ember.View.extend({
    loggedBinding: 'App.mainController.logged'
});

// change in controller will be propagated to the view
App.mainController.set('lo?gged', true);??????
Run Code Online (Sandbox Code Playgroud)