On the first load since the signal is not initialised the template vars are not replaced.
Clicking this button will set the signal sigH1 to a string containing a JSON array ( see the emulator section )
<p>
On the first load since the signal is not initialised the template vars are not replaced.
Clicking this button will set the signal <b>sigH1</b> to a string containing a JSON array ( see the emulator section )
<ch5-button label="Btn1" sendEventOnClick="trigH1"></ch5-button>
</p>
<ch5-list size="5"
orientation="horizontal"
indexId="idx"
minWidth="250px"
maxWidth="500px"
minHeight="100px"
maxHeight="150px"
itemWidth="125px"
itemHeight="75px"
scrollbar="true"
receiveStateTemplateVars="sigH1">
<template>
<div class="horizontal-list-item">
<span class="{{cssClass}}">item_{{idx}} {{label}}</span>
</div>
</template>
</ch5-list>
.horizontal-list-item {
border: 1px solid transparent;
color: #155724;
background-color: #d4edda;
border-color: #c3e6cb;
display: table;
width: 100%;
height: 100%;
}
.horizontal-list-item span {
display: table-cell;
vertical-align: middle;
text-align: center;
}
.red {
background-color:red;
color:white;
}
.green {
background-color:green;
color:white;
}
.blue {
background-color:blue;
color:white;
}
On the first load since the signal is not initilised the template vars are not replaced.
Clicking this button will set the signal sigV1 to a string containing a JSON array ( see the emulator section )
<p>
On the first load since the signal is not initilised the template vars are not replaced.
Clicking this button will set the signal <b>sigV1</b> to a string containing a JSON array ( see the emulator section )
<ch5-button label="Btn1" sendEventOnClick="trigV1"></ch5-button>
</p>
<ch5-list size="5"
orientation="vertical"
indexId="idx"
minWidth="150px"
maxWidth="165px"
minHeight="100px"
maxHeight="150px"
itemWidth="150px"
itemHeight="75px"
scrollbar="true"
receiveStateTemplateVars="sigV1">
<template>
<div class="horizontal-list-item">
<span class="{{cssClass}}">item_{{idx}} {{label}}</span>
</div>
</template>
</ch5-list>
.vertical-list-item {
border: 1px solid transparent;
color: #155724;
background-color: #d4edda;
border-color: #c3e6cb;
display: table;
width: 100%;
height: 100%;
}
.vertical-list-item span {
display: table-cell;
vertical-align: middle;
text-align: center;
}
.red {
background-color:red;
color:white;
}
.green {
background-color:green;
color:white;
}
.blue {
background-color:blue;
color:white;
}