复选框检查角度4中的值是否为true

时间:2018-10-30 06:11:00

标签: angular typescript angular4-forms

在特定条件下,我需要一个复选框。例如,每当accept()函数调用时,它会通过将true作为参数来触发onApprovedDateChecked()函数。每当我得到{{ 1}}我需要选中此复选框。有人可以帮我解决这个问题吗?

component.html

true

component.ts

 <p-checkbox label="dsd" formControlName="fcont" binary="true" 
                               (onChange)="onChecked($event)"></p-checkbox>

4 个答案:

答案 0 :(得分:2)

<p-checkbox label="dsd" [(ngModel)]="status" 
formControlName="fcont" binary="true"(onChange)="onChecked($event)"></p-checkbox>

现在在ts文件中像这样在构造函数之前定义状态

    import { Component, OnInit } from '@angular/core';
    import {ActivatedRoute, Router} from '@angular/router';

    @Component({
      selector: 'component',
      templateUrl: './component.html',
      styleUrls: ['./component.scss']
    })
    export class RequestReturnComponent implements OnInit {
    status: boolean = false;
    constructor() {}

    ngOnInit() {}

    accept(){
     onChecked(true)
    }

    onChecked(e: any){
      this.status = true;
    }
  }

答案 1 :(得分:0)

使用ngModel和二进制文件更改其布尔值

<p-checkbox label="dsd" [(ngModel)]="obj.status" 
formControlName="fcont" binary="true"(onChange)="onChecked($event)"></p-checkbox>

将obj.status设置为true或false进行更改。

accept(){
 onChecked(true)
}

onChecked(e: any){
  this.obj.status = true;
}

答案 2 :(得分:0)

您可能会喜欢使用async管道,其实现看起来像这样

@Component({
  selector: 'async-checkbox-pipe',
  template: '<input type="checkbox" [checked]="onApprovedDateChecked | async" /> Async checked'
})
export class AsyncCheckboxPipeComponent {
  onApprovedDateChecked = new Observable<string>((observer: Observer<string>) => {
    // use the observer to dispatch checked or not later on
      setTimeout(() => {
        return observer.next(true|false)
      }, 1500);
  });
}

此处示例https://stackblitz.com/edit/angular-8cqcph

答案 3 :(得分:0)

HTML

MD

component.ts

<p-checkbox label="dsd" [checked]="checkValue" formControlName="fcont" (onChange)="onChecked($event)">
</p-checkbox>

---功能---

//declare variable

checkValue:boolean = false;