In this section, we are going to update the web app template to have a toggle button, quite similar to what we had in Chapter 2, IoTFW.js - I, and Chapter 3, IoTFW.js - II. Using the toggle button, we are going to turn on/off the relay manually. In the later sections, we are going to automate them.
Open, web-app/src/app/device/device.component.html and update it, as follows:
<div class="container"> <br> <div *ngIf="!device"> <h3 class="text-center">Loading!</h3> </div> <div class="row" *ngIf="lastRecord"> <div class="col-md-12"> <div class="panel panel-info"> <div class="panel-heading"> <h3 class="panel-title"> {{device.name}} </h3> <span class="pull-right btn-click"> <i class="fa fa-chevron-circle-up"></i> </span> ...