您好,我正在使用 Syncfusion Essential JS2 for JavaScript(ES5),并尝试使用网格组件渲染此测试数据数组中的数据:
var testdata = [{firstName: 'Tony', lastName: 'Stark'}, {//some other objects}];
我像这样创建了网格对象:
var grid = new ej.grids.Grid({
dataSource: testdata,
rowTemplate: '#row-template',
columns: [
{field: 'firstName', headerText: 'First Name'},
{field: 'lastName', headerText: 'Last Name'}
],
});
grid.appendTo('#grid');
我的 jsp 中的实际模板脚本如下所示:
<script id="row-template" type="text/x-template">
<tr>
<td>${firstName}</td> <!-- should render 'Tony' -->
<td>${lastName}</td> <!-- should render 'Stark' -->
</tr>
</script>
当我运行它时,td 标签是空白的。看起来“${}”语法不起作用, 然后我尝试将硬编码值放入 td 标签内,
<td>Test First Name</td>
<td>Test Last Name</td>
果然,硬编码值已成功呈现。但我需要从“testdata”数组中获取值..
我希望这里有人曾经使用过网格组件。请帮我。 以下是我使用的技术:
Syncfusion Essential JS(ES5), 联合应用程序, Spring ,
谢谢。
最佳答案
我终于解决了这个问题。 问题在于 Syncfusion 的模板引擎和 JSTL (JSP) 模板引擎具有相同的语法:
${expression}
因此,这个脚本:
<script id="row-template" type="text/x-template">
<tr>
<td>${firstName}</td> <!-- should render 'Tony' -->
<td>${lastName}</td> <!-- should render 'Stark' -->
</tr>
因为它是在 jsp 文件中编写的,所以 ${firstName} 和 ${lastName} 被呈现为就好像它是 JSTL 表达式一样。这就是 td 标签为空的原因。
为了解决这个问题,我只是将模板代码从 jsp 移到了我的 js 文件中。
var grid = new ej.grids.Grid({
dataSource: testdata,
rowTemplate: '<tr><td>Write template code here</td></tr>',
columns: [
{field: 'firstName', headerText: 'First Name'},
{field: 'lastName', headerText: 'Last Name'}
],
});
grid.appendTo("#Grid");
关于javascript - Syncfusion 无法从数据源呈现网格行模板表达式值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50316787/