lib/product_detail_component.html

   1
   2 <div *ngIf="prod != null" style="margin-left:0.5cm;">
   3         <h2>{{prod.name}}</h2>
   4         <div><label>Id: </label>{{prod.id}}</div>
   5         <div><label>Name: </label>{{prod.name}}</div>
   6         <div><label>Price: </label>{{prod.price}}</div>
   7         <div><label>Category: </label>{{prod.category}}</div>
   8 </div>
   9
  10 <div class="mdl-card mdl-shadow--2dp admin_edit">
  11 <div class="mdl-card__title">
  12         Update/delete product
  13 </div>
  14 <div class="mdl-card__actions mdl-card--border">
  15         <div style=float:left;>
  16         <div class="mdl-textfield mdl-js-textfield
  17                     mdl-textfield--floating-label ain">
  18                 <input class="mdl-textfield__input" type="text" id="pn"
  19                        [(ngModel)]="prod_name">
  20                 <label class="mdl-textfield__label" for="pn">Name</label>
  21         </div>
  22         <div class="mdl-textfield mdl-js-textfield
  23                     mdl-textfield--floating-label ain">
  24                 <input class="mdl-textfield__input" type="text" id="pp"
  25                        [(ngModel)]="prod_price">
  26                 <label class="mdl-textfield__label" for="pp">
  27                         Price
  28                 </label>
  29         </div>
  30         </div>
  31         <div class=asel>
  32                 <div class=aseldesc>
  33                 Product category
  34                 </div>
  35                 <select [(ngModel)]="prod_category" required>
  36                         <option *ngFor="let prodcat of prodcats"
  37                                 [value]="prodcat.id">
  38                                 {{prodcat.name}}
  39                         </option>
  40                 </select>
  41         </div>
  42         <div style=clear:left;>
  43         <button class="mdl-button mdl-js-button mdl-button--raised abtn"
  44                 (click)="updateProduct()">
  45                 Update
  46         </button>
  47         <button class="mdl-button mdl-js-button mdl-button--raised abtn"
  48                 (click)="deleteProduct(prod)">
  49                 Delete
  50         </button>
  51         </div>
  52 </div>
  53 </div>
  54