kfmc_website/src/app/dashboard/sections/add-section/add-section.component.html

<div class="addDepartment-w">
    <div class="container">
       <div class="row">
        <div class="col-12">
          <ul class="list-unstyled titileLi-w">
            <li class="headingText-w">خدمه الصلاحيات > </li>
            <li class="headingText-w" style="cursor:pointer" (click)="perviousLocation()">الاقسام > </li>
            <li class="headingText-w activeLi-w" style="margin-right:5px">  {{typeLink}} </li>
          </ul>
        </div>
      </div>

      <div class="containerContent-w">
          <form (ngSubmit)="onSubmitted()" #f="ngForm" style="margin-top: 30px;">
              <div class="row">
                <div class="col-12 col-sm-6 col-md-4 col-lg-4">
                  <div class="form-group">
                    <label for="name">الأسم <span class="spanReqired-w">*</span></label>
                    <input type="text" name="name" class="form-control" placeholder="الأسم" ngModel #name="ngModel" [ngModel]="section.name" required/>
                  </div>
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-4">
                  <div class="form-group">
                    <label for="email">الأيميل <span class="spanReqired-w">*</span></label>
                    <input type="email" class="form-control" name="email" placeholder="الإيميل" ngModel email #email="ngModel" [ngModel]="section.email" required/>
                    <span class="help-block" *ngIf="!email.valid && email.touched" style="color:red">من فضلك أدخل إيميل صحيح</span>
                  </div>
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-4">
                  <div class="form-group">
                    <label for="phone">رقم الجوال</label>
                    <input type="phone" appNumberDerictive class="form-control" placeholder="الهاتف" name="phone" ngModel #phone="ngModel" [ngModel]="section.phone"/>
                  </div>
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-4">
                  <div class="form-group">
                    <label for="switch_phone">رقم الجوال البديل</label>
                    <input type="phone" appNumberDerictive class="form-control" placeholder="الهاتف البديل" name="switch_phone" ngModel #switchPhone="ngModel" [ngModel]="section.switch_phone"/>
                  </div>
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-4">
                  <div class="form-group">
                    <label for="status">الحاله</label>
                    <select name="status" class="form-control" [ngModel]="section.status">
                      <option value="1">فعال</option>
                      <option value="0">غير فعال</option>
                    </select>
                  </div>
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-4">
                  <div class="form-group">
                    <label>الاداره <span class="spanReqired-w">*</span></label>
                    <select [ngModel]="section.adminstration_id" name="adminstration_id" class="form-control" required>
                      <option *ngFor="let admin of adminstartionsList; let i = index" [value]="admin.id">{{admin.name}}</option>
                    </select>
                  </div>
                </div>
                <div class="col-6">
                    <button type="submit" class="btn btn-success rightW" [disabled]="!f.valid || checkSaveDisabled">حفظ</button>
                    <button type="button" class="btn btn-warning rightW" (click)="authSer.backFromEdit()">إلغاء</button>
                </div>
            </div>
          </form>
      </div>
    </div>
  </div>