Блог

У меня есть компонент, который загружается в первый раз. Когда я добавляю новые данные, я хочу перезагрузить компонент. Может кто-нибудь, пожалуйста, помогите мне, как это сделать в angular9?

Если я использую routeReUseStrategy , он перезагружает компонент, но кнопка не будет доступна для нажатия в следующий раз.

Я отвечаю вам примером, в этом примере вы хотите добавить устройство

adddevice.component.html

 <form [formGroup]="deviceadd" (ngSubmit)="adddevice()" class="was-validated" >
  <div class="form-group row">
   <label class="col-sm-3 col-form-label" for="inpute1">device name</label>
      <div class="col-sm-6">
        <input type="text" class="form-control form-white" id="inpute1" [formControl]="devicetitle" required  >
        <div *ngIf="devicetitle.invalid amp;amp;  (devicetitle.dirty || devicetitle.touched) " class="alert alert-danger">
          <div *ngIf="devicetitle.errors.required">
            please inpute device name
         </div>
        </div>
      </div>
  </div>
  <div>
   <button type="submit"   class="btndestorytb btn btn-primary ml-1 waves-effect waves-light save-category" [disabled]="!deviceadd.valid" >SUBMIT</button>
   <button type="button"  [hidden]="btnmsg" class="{{cus_class}}">{{msg}}</button>
  </div>
</form>
  

adddevice.component.ts

 devicetitle = new FormControl('', [Validators.required,]);

    deviceedite: FormGroup = this.builder.group({
    edevicetitle: this.edevicetitle,
  });
  
  showdevice()
  {
      this.api.showdevices().subscribe(
        (data) => {
          if (data.status == 200) {
            this.arrdevices = data.body;
          }
        },
        (error) => {
          if(error.status==500 )
          {
            this.msg=error.detail;
          }
        }
      );
  }

  adddevice() {
     this.api.adddevice(this.deviceadd.value).subscribe(
       (data)=>
       {
         if(data.status==200)
         {
          this.cus_class="btn btn-outline-success waves-effect waves-light width-md";
           this.btnmsg=false;
          this.msg="add device success";
          this.showdevices();
         }
       },
       (err)=>
       {
        if(err.status==500 )
          {         
            this.msg=err.error.detail;
          }

       }
     )

  }
  

существует точка, вы должны поместить функцию showdevice() в функцию adddevice(), чтобы при добавлении пользователем устройства функция showdevice перезагружалась в компоненте.