Nested custom widgets: how to use a custom widget inside another custom widget?

I am working on a custom widget to display the state of several items of a whole floor on a 3D map of that floor. I started to create a custom widget for my roller shutters. Now I want to include that widget multiple times within my custom “floor widget”. For the floor widget I used the code from Background as a starting point. The example uses <widget-switch>. Let’s say my own custom widget is called “Rollershutter”, how do I reference it within my other custom widget that displays the 3D floor map?

Something like this should work:

<div ng-init='model={
  "customwidget": "Rollershutter",
  "config": {
    "configkey1": "configvalue1",
    "configkey2": "configvalue2",
  <widget-template ng-model="model"></widget-template>

Replace the config according to your widget’s of course.

1 Like