0

New to Node-RED. I have a table of data. I want to display it.

The Status field will be either "In Use" or "Not in Use", depending on the values from the query. I would like to have the text green if the Status is "In Use", and red if the Status is "Not in Use".

This is being displayed on a (dashboard) template node, and the template is as follows:

<div layout="row" layout-align="start center">
    <span flex><b>Station</b></span> 
    <span flex><b>Status</b></span>
    <span flex><b>Current Part</b></span> 
    <span flex><b>In Box</b></span>
    <span flex><b>Operator</b></span>
    <span flex><b>Boxes Filled</b></span>
    <span flex><b>Scrapped</b></span>
    <span flex><b>Rework</b></span>
</div>
<div layout="row" layout-align="start center" ng-repeat="x in msg.payload | limitTo:20">
    <span flex>{{msg.payload[$index].Station}}</span>

    if (msg.payload[$index].Status="In Progress" {
        <span flex style="color: green">{{msg.payload[$index].Status}}</span>    
    }
    else (
        <span flex style="color: red">{{msg.payload[$index].Status}}</span>
    }
    <span flex>{{msg.payload[$index].CurrentPart}}</span>
    <span flex>{{msg.payload[$index].CurrentQty}}</span>
    <span flex>{{msg.payload[$index].OperatorName}}</span>
    <span flex>{{msg.payload[$index].FullBoxesToday}}</span>
    <span flex>{{msg.payload[$index].ScrapToday}}</span>
    <span flex>{{msg.payload[$index].ReworkToday}}</span>
</div>

The whole IF statement is showing. I tried a couple of other different methods... but no luck. Any ideas please?

AdzzzUK
  • 288
  • 3
  • 12
  • use `ng-show`/`ng-if`: e.g. `ng-show="msg.payload[$index].Status=='In Progress'"` – Aleksey Solovey Apr 09 '18 at 14:30
  • Enough of a push to get me to a solution, thanks. Can you add it as an answer and I'll accept it? – AdzzzUK Apr 09 '18 at 14:56
  • also why are you not using your selected element `x` instead of `msg.payload[$index]` (from `ng-repeat="x in msg.payload ...`)? e.g. `x.Status` would also work – Aleksey Solovey Apr 09 '18 at 14:58
  • Honestly? Didn't know I could... I'm very (very) new to this and the language in general, and trying to learn stuff *WAY* outside my comfort zone. I'm usually a SQL guy. Most of the stuff above has been cobbled together from multiple sources and sort of works. Ish. After a bit of fettling. – AdzzzUK Apr 09 '18 at 15:01
  • Read tutorials, and maybe [this quick guide](https://stackoverflow.com/questions/14994391/thinking-in-angularjs-if-i-have-a-jquery-background). Also if you are pulling the data from the DataBase and it doesn't change (read-only), you can use one-way data-binding with `::`, for example `ng-repeat="x in ::msg.payload`, and `{{::x.Station}}`, which will remove _watchers_ (reduces lag when 1000+ of watchers are used) – Aleksey Solovey Apr 09 '18 at 15:08
  • Thanks @AlekseySolovey - incorporated your suggestions and it's working well. Am working my way through tutorials and will for sure read what I can. – AdzzzUK Apr 09 '18 at 15:10

0 Answers0