Hi Vasudeva ,
Greetings from Syncfusion support.
We have checked your requirement. From your provided details we assume that your requirement is to load the same dashboard component in different places in an application.
To achieve your requirement, you can create a custom component in angular application and render the Dashboard layout inside and refer the component in different places using angular selector tag.
Create a custom component as dashboard-root and use the tag in main page. Refer the below code snippet.
|
<div id="idv5">
<dashboard-root style="display:block;height:100%"></dashboard-root>
</div> |
We have generated the component inside the dashboard-root tag. Refer the below code snippet.
|
*/
@Component({
selector: 'dashboard-root',
templateUrl: 'dashboard.component.html',
styleUrls: ['dashboard.component.css'],
encapsulation: ViewEncapsulation.None
}) |
Refer the sample link below.
As you have mentioned as clone, In DashboardLayout component, you can get the panel settings (Row, Col, SizeX, sizeY) using serialize method. Using this panel setting, you can assign this settings on another dashboard.
To more about the serialize method, refer the below link.
Refer the below links to more about the DashboardLayout.
If we misunderstood your requirement, can you please share the below details. It will help us to resolve your problem at the earliest.
1. Share your exact requirement.
2. Code snippet or Video footage for your requirement.
Please let us know, if you need any further assistance.
Regards,
Sowmiya.P
