在Angular2中绑定ngIf

史蒂夫·K

考虑以下子组件:

@Component({
    selector: 'mySelector',
    template: `<ion-spinner [ngIf]="ngif"></ion-spinner>`
})


export class MyDirective {

    ngif: boolean;
    constructor() {}

    @Input() serverWaiting:boolean = true;
    @HostBinding('ngIf')

    ngOnChanges() {
        this.ngif = !this.serverWaiting ? true : null;
    }

主机组件的模板:

 <mySelector [serverWaiting]></mySelector>

主机组件:

@Component({
    templateUrl: 'hostComp.html',
    directives: [myDirective]
})

export class HostComp {
    serverWaiting = true;
}

然而,微调框未显示。知道我在做什么错吗?

资料来源:https : //angular.io/docs/ts/latest/api/common/index/NgIf-directive.html

贡特·佐赫鲍尔(GünterZöchbauer)

@HostBinding('ngIf')装饰需要与应约束和属性值之前。

export class MyDirective {
    constructor() {}

    @HostBinding('ngIf')
    ngif: boolean;

    @Input() serverWaiting:boolean = true;

    ngOnChanges() {
        this.ngif = !this.serverWaiting ? true : null;
    }
}

该代码无效

<mySelector [serverWaiting]></mySelector>

[serverWaiting]表示属性绑定,但不绑定值。true如果您期望如此,则不会分配你需要

<mySelector [serverWaiting]="true"></mySelector>

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章