[JavaScript] registerStateObjectLink

Le développement
#1

Bonjour
Grand débutant avec HTML et angular.
J’ai un soucis pour récupérer les StateObject
J’ai repris les exemple de la doc et le code ci dessous marche


   <script>
        
		var myDemoApp = angular.module('MyDemoApp', ['ngConstellation']);
		myDemoApp.controller('MyController', ['$scope',  'constellationConsumer', function ($scope, constellation) {
            constellation.initializeClient("http://192.168.0.150:8088", "51abb9636078defbf888d8457a7c76f85c8f114c", "TestAPI");
            constellation.onConnectionStateChanged(function (change) {
                if (change.newState === $.signalR.connectionState.connected) {
                    constellation.registerStateObjectLink("*", "HWMonitor", "/intelcpu/0/load/0", "*", function (so) {
                        $scope.$apply(function() {
                            $scope.cpu = so;
                        });
                    });
                }
            });
            constellation.connect();
            $scope.cpus = {}
		}]);

    </script>

</head>
<body ng-controller="MyController">
    <p>CPU on {{cpu.SentinelName }} at {{cpu.LastUpdate | date : 'dd//MM/yyyy @ hh:mm:ss' }} is <strong>{{cpu.Value.Value | number:2}} {{cpu.Value.Unit}}</strong></p>

Par contre quand je le change pour celui ci. sa ne marche pas


    <script>
        
		var myDemoApp = angular.module('MyDemoApp', ['ngConstellation']);
		myDemoApp.controller('MyController', ['$scope',  'constellationConsumer', function ($scope, constellation) {
            constellation.initializeClient("http://192.168.0.150:8088", "51abb9636078defbf888d8457a7c76f85c8f114c", "TestAPI");
            constellation.onConnectionStateChanged(function (change) {
                if (change.newState === $.signalR.connectionState.connected) {
                    constellation.registerStateObjectLink("*", "HWMonitor", "*", "*", function (so) {
                        $scope.$apply(function() {
                            $scope.cpu = so;
                        });
                    });
                }
            });
            constellation.connect();
            $scope.cpus = {}
		}]);

    </script>

</head>
<body ng-controller="MyController">
    <p>CPU on {{cpu.SentinelName }} at {{cpu.LastUpdate | date : 'dd//MM/yyyy @ hh:mm:ss' }} is <strong>{{cpu['/intelcpu/0/load/0'].Value.Value | number:2}} {{cpu['/intelcpu/0/load/0'].Value.Unit}}</strong></p>

Cette partit ci {{cpu.HWMonitor[’/intelcpu/0/load/0’].Value.Value | number:2}} {{cpu.HWMonitor[’/intelcpu/0/load/0’].Value.Unit}} ne marche pas.
J’ai essayer plusieurs chose mais rien ne marche. les valeurs ne s’affiche pas

Si quelqu’un peux me dire comment faire sa serait gentil

#2

Bonjour,

Tout d’abord je vois que tu as changé le lien de :
registerStateObjectLink("", “HWMonitor”, “/intelcpu/0/load/0”, "",
à
registerStateObjectLink("", “HWMonitor”, "", “*”,

C’est à dire que dans le 1er exemple tu demandes le SO nommé “/intelcpu/0/load/0” du package “HWMonitor” alors que dans la V2 tu demandes TOUS les SO du package HWMonitor.

De ce fait à chaque update d’un SO de ce package (et quelque soit la sentinelle), il écrase la variable de scope $scope.cpu. Tu aura donc dans cette variable tantôt le CPU, tantôt la RAM, la conso réseau, etc… Ce qui ne va pas aller !

De plus, même si tu spécifies le nom du SO dans le registerStateObjectLink, il n’y a pas de propriété qui se nomme “/intelcpu/0/load/0” sur l’objet “so” => le “/intelcpu/0/load/0” est la valeur de la propriété “Name”. Ainsi cpu[’/intelcpu/0/load/0’] ne veut rien dire !

D’après ce que comprends, tu essayes d’afficher la liste et valeur des différents SO publiés par le package HWMonitor.

Pour cela je te conseille le JS suivant :

$scope.hw = {};
constellation.registerStateObjectLink("*", "HWMonitor", "*", "HWMonitor.SensorValue", function (so) {
    $scope.$apply(function () {
        $scope.hw[so.Name] = so.Value;
    });
});

L’idée est de déclarer une variable de scope “hw” qu’on initialise comme un objet. On crée ensuite un SOLink vers le package HWMonitor en spécifiant également le type des SO à “HWMonitor.SensorValue”. Ca permet de récupérer que les SO représentation des “Sensor” (CPU, RAM, Réseau, T°, etc…) et non le SO “HardwareList”.

Dès qu’un sensor est mis à jour, tu enregistre la valeur du SO (so.Value) dans l’objet “hw” sous la propriété Name.

De ce fait tu peux avoir la même syntaxe que celle que tu as tenté plus haut : hw['/intelcpu/0/load/0'] pour la charge CPU par exemple. Tu peux ainsi placer sur ta vue HTML les différents capteurs hardware où tu souhaites.

Pour lister l’ensemble dans un tableau HTML on pourrait faire une boucle sur l’objet “hw” pour afficher le nom, la valeur et l’unité du SensorValue :

<table>
    <thead>
        <tr>
            <th>Name</th>
            <th>Value</th>
            <th>Unit</th>
        </tr>
    </thead>
    <tbody>
        <tr ng-repeat="h in hw">
            <td>{{h.Name}}</td>
            <td>{{h.Value}}</td>
            <td>{{h.Unit}}</td>
        </tr>
    </tbody>
</table>

Précision, ici “h” dans la boucle n’est pas le SO mais la valeur du SO. De ce fait h.Name n’est pas le nom du SO mais la propriété Name de la valeur du SO. Je rappelle que dans l’exemple JS, on range dans $scope.hw[so.Name] la valeur du SO (so.Value) et non le SO au complet.

Bien à toi,

#3

Merci de la réponse.
je comprend mieux.
en fait hw et un dictionnaire ou tu enregistre tout et après tu le lit avec ng-repeat=“h in hw”
et si je veux sortir que la valeur de par ex : ‘/hdd/3/load/0’ je met ceci <tr ng-repeat=“h in hw” ng-if="’/hdd/3/load/0’ == h.Name">

#4

hw est un objet JS qui contient des propriétés nommées avec le nom du SO.

Si tu veux un SO en particulier, par exemple ‘/hdd/3/load/0’, intule de passer par une boucle tu écriras tout simplement : hw[’/hdd/3/load/0’].

De plus dans ton exemple, si tu utilises une boucle il faudra utiliser les filtres ou mettre un “ng-if” dans ls balises enfants, car écrit tel quel le “ng-if” s’applique au “tr” et non au item de ton itération.

#5

je te remercie des réponses.
Je commence a mieux comprendre.
J’ai réussit a faire ce que je voulais avec tes exemples.

Merci