检测Angular2内部组件的变化？ [复制]

Question

我有一个复选框组件（我自己的设计）并像这样使用它：

主要组件：

 let allowChenge = false;
    let field = {
       text: 'text text text',
       visible: true
    }

checkField(value: boolean, field: any) {
   // when I get value=false 
   if (this.allowChenge) {
      this.field.visible = value;
   } else {
      this.field.visible = true;
   }
}

主组件 HTML：

<p-checkbox 
   [value]="field.visible"
   [text]="field.text"
   [readonly]="false"
   (onSelect)="checkField($event, field)"
></p-checkbox>

复选框组件：

@Component({
    selector: 'p-checkbox',
    template: `
        <div style="float: left;">                        
                <label 
                   class="switch" 
                   [class.checked]="value" 
                   [style.opacity]="readonly ? '0.4' : '1.0'"
                >
                   {{ text }}
                </label>            

        </div>
    `
})
export class CheckBoxComponent {    

    @Input() value: boolean;    
    @Input() readonly: boolean = false;    
    @Input() text: string;    

    @Output() onSelect: EventEmitter<any> = new EventEmitter();

    constructor(public _elRef: ElementRef) {

    }    

    ngOnChanges(changes: any) {
        this.value = changes.value.currentValue;
    }    

    select() {
        if (!this.readonly) {
            this.value = !this.value;
            this.onSelect.emit(this.value);
        }        
    }     
}

在某些情况下，当我单击复选框时，我不需要更改 field 对象 visible 值。当field.visible = true 和我点击ckeckbox 时，复选框this.value 变为false。然后在父组件上我将它设置回true。但是复选框用值false表示。

Answer 1

从更改检测器的角度来看，没有任何更改，因此它不会将更改从父级传播到子级。我已经在这里回答了这样一个问题：

Angular 2 - Checkbox not kept in sync

您可以在答案中获得更多详细信息，例如为什么会发生这种行为（我已经绘制了一个很好的架构 ^_^ ）。

tldr;

checkField(value: boolean, field: any) {   
  this.field.visible = value;
  if (!this.allowChange) {
      setTimeout(()=>this.field.visible = true);
   }
}

并不是说最好将参数传递给复选框以避免选择。为什么不用[readonly]="!allowChange" 之类的呢？