烬JS与数据表插件(ember js with datatables plugin)

2019-09-18 14:43发布

我试图与Ember JS DataTable中的jQuery插件。 貌似时刻灰烬尝试更新一些新的数据,DOM,它有一个问题表具有的风格,并插入像搜索栏的一些元素后,Twitter的引导分页页脚等,代码如下

App.TableView = Em.View.extend({
    classNames:['table','table-striped','table-bordered','dataTable'],
    tagName:'table',
    didInsertElement:function (){
       this.$().dataTable({

           "sPaginationType": "bootstrap",
           "oLanguage": {
               "sLengthMenu": "_MENU_ records per page"
           }
       });
    }
});

在车把的用法如下:

{{#view App.TableView }}
        {{view App.ListStaffView}}
 {{/view}}

该App.ListStaffView中有以下

App.ListStaffView = Ember.View.extend({
  templateName:    'list',
  staffBinding: 'App.staffController',

  showNew: function() {
    this.set('isNewVisible', true);
  },

  hideNew: function() {
    this.set('isNewVisible', false);
  },

  refreshListing: function() {
    App.staffController.findAll();
  }
});

和列表模板如下:

<thead>
                        <tr>
                        <th>Name</th>
                        <th>Email</th>
                        </tr>
                        </thead>
                        <tbody>
                        {{#each staff}}
                        {{view App.ShowStaffView staffBinding="this"}}
                        {{/each}}
                        </tbody>

                        <tfoot>
                        <div class="commands">

                        <a class="btn btn-inverse" href="#"{{action "showNew"}}>
                            <i class="icon-plus"></i>
                        </a>
                        <a class="btn btn-inverse" href="#"{{action "refreshListing"}}>
                            <i class="icon-refresh"></i>
                        </a>

                        </div>
                        </tfoot>

加载此错误后就是这个样子

错误:无法在的Metamorph执行操作

我做了数据表集成与零配置和失败。 由于灰烬无法将数据插入到DOM,JQuery的数据表口口声声说“无数据”

Answer 1:

数据表将正常工作的一些预期的DOM结构,相同的情况下灰烬也。 如果使用的是两个,一个会修改对方的预期DOM结构。 这是问题的原因。

如果你决定使用灰烬,然后用灰烬部件库像flame.js为TableViews。



Answer 2:

我有同样的问题,并能够通过调用重新呈现()上保存表视图来解决这个问题。

例如,在我看来,我有一个名为editRow()方法更改表文本输入框。 这是我如何做的:


    editRow: function(event)
    {
        var obj = event.context;
        obj.setIsEditing(true);
        this.rerender();
    }



Answer 3:

你不能使用#each助手用数据表的表将被“覆盖”在表内。



文章来源: ember js with datatables plugin