小葱儿 发表于 2017-6-9 17:14:11

wijmo 中的grid

angularjs2   ts编码模式下   如何在grid中的一列中显示<a>标签超链接

JeffryLI 发表于 2017-6-12 10:44:07

您好，您可以使用慢板工具来实现这样的功能，我给您提供部分示例代码，请参照：

        // template for "Template" cells
        var theTemplate = '<a>操作</a>';

        // grid with template
        var theGrid = new wijmo.grid.FlexGrid('#theGrid', {
           autoGenerateColumns: false,
    columns: [
            { binding: 'country', header: 'Country' },
      { binding: 'template', header: 'Template', width: 130, isReadOnly: true },
      { binding: 'sales', header: 'Sales', format: 'n2' },
      { binding: 'expenses', header: 'Expenses', format: 'n2' }
    ],
        itemsSource: getData(),
    showAlternatingRows: false,
                formatItem: function(s, e) {
            if (e.panel == s.cells && s.columns.binding == 'template') {
              var item = s.rows.dataItem,
                              html = wijmo.format(theTemplate, item);
                        e.cell.innerHTML = html;
      }
    }
        });

小葱儿 发表于 2017-6-15 15:39:06

JeffryLI 发表于 2017-6-12 10:44
您好，您可以使用慢板工具来实现这样的功能，我给您提供部分示例代码，请参照：

现在我代码是这么写的,该怎么处理操作列是个a标签
html:


               <wj-flex-grid ="cvFilter" ="true" style="width:100%;">
                                    <wj-flex-grid-column ="'报警来源'" ="'C1'" ="'*'"></wj-flex-grid-column>
                                    <wj-flex-grid-column ="'位置名称'" ="'C2'" ="'*'"></wj-flex-grid-column>
                                    <wj-flex-grid-column ="'状态'" ="'C3'" ="'n0'" ="'*'"></wj-flex-grid-column>
                                    <wj-flex-grid-column ="'发生时间'" ="'C4'" ="'*'"></wj-flex-grid-column>
                                    <wj-flex-grid-column ="'警情描述'" ="'C5'" ="'*'"></wj-flex-grid-column>
                                    <wj-flex-grid-column ="'处理方式'" ="'C6'" ="'*'"></wj-flex-grid-column>
                                    <wj-flex-grid-column ="'操作'" ="'C7'" ="'*'"></wj-flex-grid-column>
                              </wj-flex-grid>
                            </div>

js
this.cvFilter = new wjcCore.CollectionView(this.dataSvc.getData(50));

JeffryLI 发表于 2017-6-15 16:32:45

您好，您使用的是Angular2 ,我给你一份参考文档http://demos.wijmo.com/5/Angular2/CellTemplateIntro/CellTemplateIntro/里面介绍了各种的模板定义。

小葱儿 发表于 2017-6-16 16:39:15

JeffryLI 发表于 2017-6-15 16:32
您好，您使用的是Angular2 ,我给你一份参考文档http://demos.wijmo.com/5/Angular2/CellTemplateIntro/Cell ...

我不明白我这么写为什么不对,加上
        <template wjFlexGridCellTemplate ="'Cell'" let-cell="cell">
                                                                                        <div>
                                                                                                <img src="minus.png" /> {{cell.item.C7}}
                                                                                        </div>
                                                                                </template>

就错了,不加就对



        <wj-flex-grid ="cvFilter" ="true" style="width:100%;">
                                                                        <wj-flex-grid-column ="'报警来源'" ="'C1'" ="'*'"></wj-flex-grid-column>
                                                                        <wj-flex-grid-column ="'位置名称'" ="'C2'" ="'*'"></wj-flex-grid-column>
                                                                        <wj-flex-grid-column ="'状态'" ="'C3'" ="'n0'" ="'*'"></wj-flex-grid-column>
                                                                        <wj-flex-grid-column ="'发生时间'" ="'C4'" ="'*'"></wj-flex-grid-column>
                                                                        <wj-flex-grid-column ="'警情描述'" ="'C5'" ="'*'"></wj-flex-grid-column>
                                                                        <wj-flex-grid-column ="'处理方式'" ="'C6'" ="'*'"></wj-flex-grid-column>
                                                                        <wj-flex-grid-column ="'操作'" ="'C7'" ="'*'">
                                                                                <template wjFlexGridCellTemplate ="'Cell'" let-cell="cell">
                                                                                        <div>
                                                                                                <img src="minus.png" /> {{cell.item.C7}}
                                                                                        </div>
                                                                                </template>
                                                                        </wj-flex-grid-column>
                                                                </wj-flex-grid>




JeffryLI 发表于 2017-6-16 17:40:31

您好，这个目前不能判断出您的问题，能不能提供个简单的能说明问题的demo给我，我帮您看一下原因吧！
页: [1]
查看完整版本: wijmo 中的grid