0

这个问题与此处给出的答案有关。

在视图中有一个复选框

App.RoleCheckbox = Em.Checkbox.extend({
    userRolesBinding: 'parentView.user.roles', // Points to the roles of the user

    checked: function () {
        var userRoles = this.get('userRoles');
        return userRoles.contains(this.get('content'));
    }.property('content', 'userRoles.@each'),

    click: function (evt) {
        //do something
        var controller = this.get("controller");
        controller.clicked(evt);
     }
});

我希望 click 函数从 RoleCheckboxController 调用 clicked 函数：

App.RoleCheckboxController = Em.Controller.extend({
    clicked: function(evt){
        //Really do the thing
    }
});

但这不起作用。我该如何解决这个问题？

JSFiddle：http: //jsfiddle.net/3fMpD/

4

3 回答 3

1

@c4p 绝对正确，问题在于您的控制器没有被创建，而且App.RoleCheckbox无法知道它应该App.RoleCheckboxController用作它的控制器。

我不太确定这是否是最符合Ember-y的方式，但您可以在 Checkbox 视图的init（构造函数）中设置控制器，然后确保send控制器具有它需要工作的所有属性和：

App.RoleCheckbox = Em.Checkbox.extend({

    init: function(){
      this._super();
      this.set('controller', new App.RoleController());  
    },

    userRolesBinding: 'parentView.user.roles',

    checked: function () {
        var userRoles = this.get('userRoles');
        return userRoles.contains(this.get('content'));
    }.property('content', 'userRoles.@each'),

    click: function (evt) {
        this.get('controller').send('clicked',this.checked, this.content);
     }
});

以及控制器的代码（只是改变函数中使用的参数）；

App.RoleCheckboxController = Em.ObjectController.extend({
    clicked: function(checked,role){

         var userRoles = App.User.roles;

         console.log("userRoles = ", userRoles);
         console.log("role = ", role);
         console.log("will be: ", !checked ? "removed" : "added");

         if (checked) { 
             userRoles.pushObject(role); 
         } else {
             userRoles.removeObject(role);
         }

         console.log("updated userRoles = ", userRoles);

    }
});

在这里工作小提琴：http: //jsfiddle.net/cfSwq/3/

希望这可以帮助！

于 2013-04-29T23:04:19.737 回答
1

您可以使用正确的命名约定来实例化控制器并将其关联到视图。

例如，这会将控制器与视图相关联：

// Instead of App.RoleCheckBoxController
App.ApplicationController = Ember.Controller.extend( /* ... */ );
App.ApplicationView = Ember.View.extend( /* .. */ );

JSFiddle：http: //jsfiddle.net/YL5rQ/

于 2013-05-03T07:23:29.690 回答
0

你App.RoleCheckboxController的永远不会被创造出来。您在那里设置事物的方式将只有一个ApplicationController.

您可以将逻辑移回视图的click事件中以使一切正常：

App.RoleCheckbox = Em.Checkbox.extend({
    userRolesBinding: 'parentView.user.roles',

    checked: function () {
        var userRoles = this.get('userRoles');
        return userRoles.contains(this.get('content'));
    }.property('content', 'userRoles.@each'),

    click: function (evt) {
        console.log("event triggered:", evt);
        //var controller = this.get("controller");
        //controller.clicked(evt);
        var isPresent = this.get('checked'),
            userRoles = this.get('userRoles'),
            role = this.get('content');

         console.log("userRoles = ", userRoles);
         console.log("role = ", role);
         console.log("will be: ", isPresent ? "removed" : "added");

         if (!isPresent) { 
             userRoles.pushObject(role); 
         } else {
             userRoles.removeObject(role);
         }
     }
});

更新了 JSFiddle

于 2013-04-29T17:17:18.107 回答