如何根据URL的结果在我的angular 7网站上更改css元素？

Question

我有一些sonoff tasmotas，并且正在为他们制作一个Web控制面板。 如果我转到http：// sonoff / cmnd？cmnd = Power （或类似的名称），它将以{“ power”：“ on”}或{“ power”：“ off”}进行响应。 如何根据此响应更改将哪些CSS类应用于html对象。 当我在不重新加载页面的情况下手动按下​​子菜单上的按钮时，我也需要更改它。

任何帮助都感激不尽

我是一个新手，我使用ng new PrinterPanel --routing创建了一个新项目，并且结构没有太大改变。

Answer 1

我猜对URL的调用是从控制器/服务进行的。 如果是这种情况，则您可能有一些要在单击和其他事件上调用的函数，也许这样的事情对您有用：

<span ng-class="styleFunction('Power')">some text</span>

并在控制器中：

$scope.styleFunction = function(param){

$http.get(http://sonoff/cmnd?cmnd=" + param)
  .then(function(response) {
    if (response[param] === 'on')
        return "ClassOn";
    else
        return "ClassOff";
  });    
  }  
}