Hi Folks,
I can see data provider in browser console. Also i can print data using oj-bind-for-each but with same dataprovider oj-table is not rendering.
html:
<style>
.demo-table-container {
width: 100%;
height: 27rem;
}
</style>
<div id="componentDemoContent" style="width: 1px; min-width: 100%;">
<oj-table id='table' aria-label='Departments Table'
data='[[dataprovider]]'
selection-mode='{"row": "multiple", "column": "multiple"}'
columns='[{"headerText": "Department Id",
"field": "DepartmentId",
"headerClassName": "oj-sm-only-hide",
"className": "oj-sm-only-hide",
"resizable": "enabled"}
]'
class='demo-table-container oj-bg-body'>
</oj-table>
</div>
<oj-bind-for-each data="[[dataprovider]]">
<template>
<oj-bind-text value="[[$current.data.DepartmentId]]"></oj-bind-text>
<template>
</oj-bind-for-each>
js:
this.deptArray = JSON.parse(deptData);
this.dataprovider = new ArrayDataProvider(this.deptArray, {
keyAttributes: "DepartmentId",
implicitSort: [{ attribute: "DepartmentId", direction: "ascending" }],
});
console.log(this.dataprovider, 'data provider')
data:
[
{
"DepartmentId": 10,
"DepartmentName": "Finance 9",
"LocationId": 300,
"ManagerId": 7001,
"StartDate": "2014-06-13",
"EmployeeCount": 335,
"Type": "Sales",
"Currency": "EUR",
"Primary": [],
"Rating": 3,
"TargetComplete": 90
},
{
"DepartmentId": 20,
"DepartmentName": "Control And Credit 9",
"LocationId": 300,
"ManagerId": 7001,
"StartDate": "2019-09-10",
"EmployeeCount": 206,
"Type": "HR",
"Currency": "USD",
"Primary": [],
"Rating": 1,
"TargetComplete": 90
}
]
version:
ojet --version
Oracle JET Command Line Interface, version: 11.1.0