代码之家  ›  专栏  ›  技术社区  ›  A. B

如何对post值1或0使用mat滑动切换

  •  -1
  • A. B  · 技术社区  · 8 年前

    我正在使用mat slide toggle表单材质,如以下示例所示 https://material.angular.io/components/slide-toggle/overview

    我在本例中遇到的问题如下:

    https://stackblitz.com/edit/angular-zafcmh-rvgjhs?file=app%2Fslide-toggle-configurable-example.ts

    当我单击一个开关时,我希望单击只得到一个开关,而不是全部。

    你能提出解决方案吗?

    我的代码html:

     <form [formGroup]="activeHomeboxPForm">
                    <mat-slide-toggle formControlName="active"
                     id="active" 
                     [(ngModel)]="device" 
                     (change)="onChange($event)"
                     (click)="onActiveHomeboxP(item.homeboxpackage_id)">
                    </mat-slide-toggle>
                    {{device}}
                  </form>
    

    我的ts代码:

        this.activeHomeboxPForm = this.fb.group({
              'active': new FormControl('', Validators.required),
              'homeboxpackage_id': new FormControl('', Validators.required)
            });
         populateFormHomeboxP() {
            this.activatedRoute.params.subscribe(
              params => {
                this.hsP.getHomeboxPById(params['id']).subscribe(
                  homeboxP => {
                    this.homeboxP = homeboxP;
                    this.activeHomeboxPForm.controls['active'].setValue(homeboxP.active);
                    this.activeHomeboxPForm.controls['homeboxpackage_id'].setValue(homeboxP.homeboxpackage_id);
                  }
                );
              }
            );
          }
    
          onActiveHomeboxP(homeboxpackageid) {
            this.loading = true;
            if (confirm('Are you sure to change Status?')) {
    
          let editHomeboxp = new HomeboxP(
            this.activeHomeboxPForm.value
          );
          editHomeboxp.homeboxpackage_id = homeboxpackageid;
          console.log(editHomeboxp)
          this.hsP.activatehomeboxp(editHomeboxp).subscribe(
            result => {
              if (result === true) {
                Materialize.toast('HomeboxPacket updated successfully', 4000);
    
              } else {
                this.loading = false;
              }
            },
    
            error => {
              this.loading = false;
            }
          );
        }
      }
      onChange(value) {
        if (value.checked === true) {
          this.device = 1;
          console.log(1);
        } else {
          this.device = 0;
          console.log(0);
        }
      }
    

    非常感谢。

    1 回复  |  直到 8 年前
        1
  •  2
  •   Nikola Gavric    8 年前

    您需要添加 device: any = [] 而不是将值绑定到 device ,将值绑定到 device[i] .

    这是工作 example

    推荐文章