Maximize productivity with
30% off* for a limited time
using BOOSTDEV30.
Includes 3- and 5-packs.
*Some exclusions may apply.New Product LaunchBoldDesk: Help desk ticketing software starts at $10 for 3 agents.
Try it for free.
<!-- placing the custom component within ng-template -->
<ng-template #CustomTemplate>
<div style="height:100%; width: 100%;" class="templateContent">
<!-- placing the diagram component inside the chart root -->
<chart-root></chart-root>
</div>
</ng-template>
<!-- adding a ng container to append the template in the container -->
<ng-container #viewContainer></ng-container> |
BtnClick() {
// adding panel dynamically
let panel: PanelModel[] = [{
id: "layout_" + this.count.toString(),
'sizeX': 4, 'sizeY': 2, 'row': 2, 'col': 0,
}];
this.Dashboard.addPanel(panel[0]);
//rendes the (CustomTemplate) template in dom
const templateValue = this.CustomTemplate.createEmbeddedView(null);
// inserts the template into the view container
this.viewContainer.insert(templateValue);
// Obtaining the content element of the panel
let panel_Content = document.getElementById("layout_" + this.count.toString() + "_content");
// appending the template to the panel content element.
panel_Content.appendChild(templateValue.rootNodes[0]);
}
} |