如何使切换按钮的行为像启动中的单选按钮一样?

时间:2019-07-09 17:31:14

标签: html angular typescript toggle primeng

我有一个以上的切换按钮,我需要做出类似单选按钮的行为。我不能使用ngMogule。我必须用FormControl来做。问题是,仅凭一个提示,我无法一次获得所有按钮的状态或值。 我认为,我遇到了这个问题,因为我无法设置FormConttrol的值。但是我已经尝试了很多不同的varialble,但我仍然没有。  有任何想法如何做到这一点?

这是我使用的子组件 child.html

<p-toggleButton
    onIcon="pi pi-times"
    offIcon="pi pi-info" 
    [onLabel]="onLabel" 
    offLabel=""
    [(ngModel)]="check" 
    [tabindex]="infoText"
    (onChange)="onChange()"></p-toggleButton>

child.ts

@Input()
 infoText: string;
 @Input()
 control: FormControl = new FormControl(this.infoText);
 @Output()
 public onNewEntryAdded = new EventEmitter();
 constructor() {
    console.log(this.control);
   //if I call hier first time I get all forms but without values
 }
 onChange() {
   this.onNewEntryAdded.emit({
      value: this.check
    })
 }

这是父组件 child.html

 <app-infoicon class="col-1" [onLabel]="notiz" [infoText]="info" #test 
    name="control" [control]="control" 
    (onNewEntryAdded)="addNewEntry($e, test)" ></app-infoicon>
    <app-infoicon class="col-1" [onLabel]="notiz" [infoText]="'2'" #test2
    name="control" [control]="control" 
    (onNewEntryAdded)="addNewEntry($e, test2)" ></app-infoicon>

child.ts

control: FormControl = new FormControl('');

  addNewEntry(e, control){
   if (false) {
      control.checked = false;
    } else {
      this.infoButton = e.checked;
    }
  }

我也尝试过

 [control]="control.setValue('1')"

 [formControlName]="control" value="1"

0 个答案:

没有答案