Ng-repeat and widget-slider on rollershutter items

Apps & Services HABPanel
, ,
1

Hi everybody,

I am stuck with my widget and would appreciate a little help.
This is my code(abstract) so far:

<div class="panel panel-default" ng-repeat="item in itemsInGroup('gRollo') track by $index">
    <div class="row">
        <div class="col-xs-4">
      		<div ng-init="model0 = {'name': itemsInGroup('gRollo')[$index].label, 'item': itemsInGroup('gRollo')[$index].name,
                        'floor': 0,
                        'ceil': 100,
                        'step': 1}">
          	<widget-slider ng-model="model0"></widget-slider>
        	</div>
      	</div>
     </div>
</div>

The slider is not visible, until I press one of the shown buttons(<,x,>). After I refresh the website the slider is hidden again.
After a new refresh/on first load:
image
After I pressed any of the buttons to change the value of the rollershutter:
image
The slider is visible but the values on the sliders are wrong. Still I can use the slider to change the blindings.

Am I missing something?

Edit: The slider also appers after a while(edit:sometimes) if I dont refresh the page or press any buttons.
The values are only wrong if I send the “stop” commant, but I thing I can handelt this.
Stil … everytime I open habpanel the slider is hidden.

2

Don’t call itemsInGroup again. On your ng-repeat, each iteration will be in the item itself so you can just use item.label and item.name directly.

Also post entire code. What does the X button do?

3

Thank you. You are right calling it twice was one of my desperate tries to get everything working.
Even if I delete the rest of the code I am still facing the same problems. Anyway here is the entire code:

<div class="panel panel-default" ng-repeat="item in itemsInGroup('gRollo') track by $index">
    <div class="row">
        <div class="col-xs-4">
      		<div ng-init="model0 = {'name': item.label, 'item': item.name,
                        'floor': 0,
                        'ceil': 100,
                        'step': 1}">
          	<widget-slider ng-model="model0"></widget-slider>
        	</div>
      	</div>
        <div class="col-xs-4">
      		<button style="border: 0; color: black; background: transparent; vertical-align: middle;" ng-click="sendCmd((item.name), 'UP')"><i class="material-icons">expand_less</i></button>
          <button style="border: 0; color: black; background: transparent; vertical-align: middle;" ng-click="sendCmd((item.name), 'STOP')"><i class="material-icons">close</i></button>
          <button style="border: 0; color: black; background: transparent; vertical-align: middle;" ng-click="sendCmd((item.name), 'DOWN')"><i class="material-icons">expand_more</i></button>
      	</div>
        <div class="col-xs-4">
      		<div class="btn-group" uib-dropdown dropdown-append-to-body="true" ng-init="options = ['Manuell', 'Sunset', 'Random', 'Time']">
  					<button id="single-button" type="button" class="btn btn-primary" uib-dropdown-toggle>
            	{{options[itemValue(item.name+'_Switch')]}} <span class="caret"></span>
  					</button>
  					<ul class="dropdown-menu" uib-dropdown-menu role="menu" aria-labelledby="single-button">
    					<li role="menuitem">
              	<a ng-click="sendCmd(item.name+'_Switch', 0)">Manuell</a>
              </li>
    					<li role="menuitem" ng-class="{ 'divider': $index==0 }" ng-repeat="option in options">
      					<a ng-if="$index != 0" ng-click="sendCmd(item.name+'_Switch', $index)">{{option}}</a>
    					</li>
  					</ul>
					</div>
    	</div>
    </div>
</div>

When I use the wall switch to controll the blinds, openhab is not updated. :frowning:

Maybe its not a problem with my widget, but rather one with my items. Maybe something with “association groups”…?

4

Quite honestly I didn’t see anything unusual but can you try to wrap your model?


<div ng-init="model0 = { m: {'name': item.label, 'item': item.name, 'floor': 0, 'ceil': 100, 'step': 1} }">
 	<widget-slider ng-model="model0.m">
        </widget-slider> 	
</div>
5

Thanks for your help. Unfortunately, wrapping the model made no difference.
But I take it as good news, that you couldn’t find anything wrong: maybe it’s not my “web development skill” that failed me. :grin:
But I still can’t get it to work correctly.:disappointed: