2

如何通过 ember.js 更改元素类点击，AKA：

<div class="row" {{bindAttr class="isEnabled:enabled:disabled"}}>

看法：

SearchDropdown.SearchResultV = Ember.View.extend(Ember.Metamorph, {
    isEnabled: false,

    click: function(){
        window.alert(true);
        this.isEnabled = true;
    }
});

单击事件在窗口警报发生时起作用，我只是无法绑定。

4

3 回答 3

5

该类已正确绑定，但该isEnabled属性只能通过.set调用来修改，例如，this.set('isEnabled', true)并且只能通过this.get('isEnabled'). 这是支持一流绑定和计算属性的 Ember 约定。

于 2012-09-05T15:52:02.913 回答
2

在您看来，您将绑定到一个类名。我的应用程序中有以下视图：

EurekaJ.TabItemView = Ember.View.extend(Ember.TargetActionSupport, {
    content: null,
    tagName: 'li',

    classNameBindings: "isSelected",

    isSelected: function() {
        return this.get('controller').get('selectedTab').get('tabId') == this.get('tab').get('tabId');
    }.property('controller.selectedTab'),

    click: function() {
        this.get('controller').set('selectedTab', this.get('tab'));
        if (this.get('tab').get('tabState')) {
            EurekaJ.router.transitionTo(this.get('tab').get('tabState'));
        }

    },

    template: Ember.Handlebars.compile('<div class="featureTabTop"></div>{{tab.tabName}}')
});

在这里，您已将您的 className 绑定到“isSelected”属性返回的任何内容。仅当视图的控制器选择的选项卡 ID 与此视图的选项卡 ID 相同时才适用。

当视图被选中时，代码将附加一个 CSS 类名“is-selected”。

如果你想在上下文中查看代码，代码在 GitHub 上：https://github.com/joachimhs/EurekaJ/blob/netty-ember/EurekaJ.View/src/main/webapp/js/app/views。 js#L100

于 2012-09-04T19:18:49.543 回答
1

很好的答案，但是我走了另一条路：

SearchDropdown.SearchResultV = Ember.View.extend(Ember.Metamorph, {
    classNameBindings: ['isSelected'],
    click: function(){

        var content = this.get('content');
        SearchDropdown.SelectedSearchController.set('content', content);
        var loadcontent = this.get('content');
        loadcontent.set("searchRadius", $("select[name=radius]").val());

        SearchDropdown.LoadMap.load(content);

    },
    isSelected: function () {
        var selectedItem = SearchDropdown.SelectedSearchController.get('content'),
          content = this.get('content');
        if (content === selectedItem) {
          return true;
        }
      }.property('SearchDropdown.SelectedSearchController.content')
});

控制器：

SearchDropdown.SelectedSearchController = Ember.Object.create({
  content: null,

});

基本上将所选视图的数据存储在控制器中，

于 2012-09-06T08:08:45.317 回答