Template widget checkbox toggle update issue

General
1

Hi,

I'm creating a project in which I want to be able to check/uncheck a checkbox manually (by clicking) and also by an external source such as MQTT input etc. In my test I simulate the external source by an inject node currently.

I managed to find actually do this, although an issue sometimes occurs in which I have to refresh the page to see the updated checkbox. I found out it happens when I first toggle the checkbox manually and then afterwards with the inject node.

Does anyone know what may cause this issue? The problem does not occur if I only trigger it manually or only with the inject node.

image

2

When I had this issue it had something to do with the digest loop of angularjs. You can trigger the loop manually by

scope.$applyAsync(function(){
    ...;
});

An example would be:


<md-input-container>
    <md-checkbox ng-model="data">
        Checkbox in an md-input-container
    </md-checkbox>
</md-input-container>

<script>
    (function(scope) {
        scope.data = false;
        
        
        
        //handle arriving messages
        scope.$watch('msg', function(msg) {
            if(msg !== undefined && msg !== null){
                try{
                    switch(msg.topic) {
                        case "cbx setting":
                            scope.$applyAsync(function(){
                                scope.data = msg.payload;
                            });
                        break;

                        default:
                        break;
                    }
                }catch(err){
                    console.error(err);
                }
            }
        });
    })(scope);
</script>

Where you can check the checkbox by this message:

{payload:true, topic:"cbx setting"}