O'Reilly logo

Practical Internet of Things with JavaScript by Arvind Ravulavaru

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Updating the web app template

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> ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required