Warning: file_get_contents(/data/phpspider/zhask/data//catemap/6/EmptyTag/143.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Aurelia 自定义属性不适用于动态内容_Aurelia_Aurelia Templating - Fatal编程技术网

Aurelia 自定义属性不适用于动态内容

Aurelia 自定义属性不适用于动态内容,aurelia,aurelia-templating,Aurelia,Aurelia Templating,我使用w2ui网格,生成的模板列如下所示: { field: 'TableCards', caption: 'Table cards', size: '10%', sortable: true , render:function(record, index, column_index) { let html = ''; if (record.TableCards) {

我使用w2ui网格,生成的模板列如下所示:

{ field: 'TableCards', caption: 'Table cards', size: '10%', sortable: true ,
            render:function(record, index, column_index) {
                let html = '';
                if (record.TableCards) {
                       record.TableCards.forEach(function(card) {
                         html += `<div class="card-holder" style="width: 12%; display: inline-block; padding: 0.5%;">
                                    <div class="poker-card blah" poker-card data-value="${card.value}"
                                        data-color="${card.color}"
                                        data-suit="&${card.suit};"
                                        style="width: 30px;height: 30px">
                                    </div>
                                </div>`;
                    });
                }
                return html;
            } 
        },
{字段:'TableCards',标题:'TableCards',大小:'10%,可排序:true,
呈现:函数(记录、索引、列索引){
让html='';
if(记录表格卡){
record.TableCards.forEach(功能(卡片){
html+=`
`;
});
}
返回html;
} 
},
你可以看到扑克牌是一个自定义属性。而且它不会在网格中渲染。
还有其他方法吗?

您可以在动态HTML上使用
模板引擎.enhance()

有关完整示例,请参阅本文:


重要注意事项:根据自定义属性的实现方式,您可能需要调用视图的生命周期挂钩,例如
.attached()

这发生在我身上,当使用库时,它们的属性为
mdl

在实现
MDLCustomAttribute
的地方可以看到这一点,现在可以看到下面的代码片段,它显示了我需要做些什么才能使
mdl
属性与动态HTML正常工作:

private _enhanceElements = (elems) => {

    for (let elem of elems) {

        let elemView = this._templEngine.enhance({ element: elem, bindingContext: this});

        //we will now call the View's lifecycle hooks to ensure proper behaviors...
        elemView.bind(this);
        elemView.attached();

        //if we wouldn't do this, for example MDL attribute wouldn't work, because it listens to .attached()
        //see https://github.com/redpelicans/aurelia-material/blob/5d3129344e50c0fb6c71ea671973dcceea14c685/src/mdl.js#L107
    }
}

我喜欢Aurelia的一点是,当你发布一个问题时,数千个答案会立即弹出,因为社区很大……你无法得到答案,因为你的问题不容易理解。首先,尝试提供更多的代码,并解释哪些代码不起作用。其次,不能以这种方式使用aurelia自定义属性。使用前端框架时,请尝试使用its功能生成行。这比使用任何jQuery插件都简单得多