lundi 25 janvier 2021

How to show the data based on the selection element(Elements coming from the backend)

My requirement is to show the data(From the selection elements coming from the backend )

.Component.html

<div class="row no-gutters">
      <div *ngFor="let map of sensors; let i = index"
        [ngClass]="{'col-12' :  sensors.length % 2 == 1 && i == sensors.length - 1, 'col-6' : i < sensors.length }" >
        <div id="map"   style="height: 320px;border: 1px solid gray;"></div> 
 
      </div>
</div>


Select Locations:<select style="width: 153px; margin-left: 2px;" data-placeholder="Select..." multiple  id="cols" name="cols" [(ngModel)]="cols" #col = "ngModel" >
 
                       <option *ngFor ="let sensor of sensors"></option>
              
                  </select>



<div *ngFor="let sensor of sensors" style="height: 270px; overflow: auto;border: 1px solid grey;">

   <h5  style="background-color: #00B5B8;color: white;padding: 8px;"> <i class="fa fa-map-marker" aria-hidden="true"></i>  </h5>
   
  <ngb-tabset class="tabset1">
    <ngb-tab title="Drones" style="color:#00B5B8 ;">
      <ng-template ngbTabContent  *ngFor="let x of wifiDrones" >
          <div *ngIf = "sensor.name === x.sensorname" >

              <div class="row no-gutters">

                  <div class="col-sm-4">

                     //some code
                  </div>
             </div>
          </div>
      </ng-template>
    </ngb-tab>
  </ngb-tabset>
</div>

Now Based on the sensor.name (coming from the sensors array in backend) from the multiple selection elements It has to show the number of maps along with the above data as given above.

(First It has to show the current location map i.e index 0 if sensors array and the data from the backend)

Aucun commentaire:

Enregistrer un commentaire