Question

我正在使用Angular2，我只想在属性为true时才显示组件。当sci等于true时，它应显示<sci-company-form>但不起作用！

如果我设置public sci: boolean = true或public sci: boolean = false，它会按预期工作。我知道这是一个基本案例，但我无法找到一个对我没有意义的解决方案。

component.html：

<input type="checkbox" (change)="isSci($event.target.checked)">
<sci-company-form *ngIf="sci"></sci-company-form>

component.ts

public sci: boolean;

    isSci($event: boolean) {
        this.sci = $event;
        console.log("this.sci : " + this.sci + "$event :" + $event);
     }

Answer 1

你也可以这样做：

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

<hello *ngIf="x"></hello>

这是thing

Answer 2

当你打印$ event时，它是否给出了预期的布尔值？

我认为最好在声明为属性时为该布尔值设置初始值，以便在针对该条件检查ngIf时，在事件之前，它可以正常工作。

Answer 3

尝试不使用目标

<input type="checkbox" (change)="isSci($event.checked)">
<sci-company-form *ngIf="sci"></sci-company-form>

True属性不显示内容

3 个答案: