角度材料滑动切换的双向绑定无法按预期工作(Angular 4)

时间:2018-03-07 15:17:39

标签: javascript angular angular-material2

我已经实现了角度材质幻灯片切换,除了某些原因它出于某种原因它不会将值绑定到相关变量之外似乎都有效吗?

// other irrevelant imports above..
import {MatDialog, MatDialogRef, MAT_DIALOG_DATA} from '@angular/material';

@Component({
  selector: 'app-calendar',
  templateUrl: './calendar.component.html',
  styleUrls: ['./calendar.component.scss'],
    host: {
     '(document:click)': 'handleClickEvent($event)',
  }
})

export class CalendarComponent implements OnInit {

  filteringSchedule: boolean = false;
  filteringSent: boolean = false;
  filteringFailed: boolean = false;
}

// component

<mat-slide-toggle
    class="calendar-filter-types"
    [ngModel]="(filteringSchedule)"
    [color]=""
    [checked]="">
    Scheduled : {{ filteringSchedule }}
</mat-slide-toggle>

检查或取消选中切换后,我希望filteringSchedule值相应地更改为true或false?但是在组件内部,由于某种未知原因,它始终保持为false - 有人能说明为什么会这样吗?

我是Angular 4

3 个答案:

答案 0 :(得分:7)

只需将您的html更新为

即可
[(ngModel)]="filteringSchedule"

答案 1 :(得分:1)

[ngModel]="(filteringSchedule)"

将此更改为:

[(ngModel)]="filteringSchedule"

答案 2 :(得分:0)

这适用于Angular8 +

date_time_str = '2020-11-05T07:48:59.418758'.replace('T', ' ')

并确保您已导入FormsModule

[(ngModel)]="filteringSchedule"