html - Angular 2+:输入修饰符不反射(reflect)复选框

我有一个组件
时间框选择器
HTML格式：

<input type="checkbox" [(ngModel)]="selected">

电话号码：

@Component({
   ...
})
export class TimeboxComponent implements OnInit {
    @Input() selected: boolean;

    constructor() {}

    ngOnInit() {
        console.log('Selected: ', this.selected);
    }
}

现在，当我创造

<app-timebox selected="false"><app-timebox/>
<app-timebox selected="true"><app-timebox/>

在这两种情况下，复选框最初都显示为选中。为什么是这个案子，我该怎么办？

最佳答案

在这两种情况下，都是绑定非空字符串，这些字符串是truthy值。使用brackets符号告诉Angular要将绑定值计算为Javascript表达式：

<app-timebox [selected]="false"><app-timebox/>
<app-timebox [selected]="true"><app-timebox/>