Angular2 : Is one time binding for *ngIf available?

我正在创建一个DOM结构，并且只想在第一次添加一些可视组件中的某些部分，并且不希望它们一次又一次地刷新，这就是* ngIf起作用的方式。这是为了避免绑定(bind)重复执行，因为我知道一旦创建，它们就永远不会改变。换句话说，Angular1具有::运算符，可以帮助实现这一点。

Angular2中是否有针对*ngIf的一次性绑定(bind)？如果在其他问题中讨论了这个问题，请指出我的问题。

最佳答案

您可以创建自己的结构指令，该指令将在初始页面加载时评估传递的表达式，并根据传递的条件值在DOM中显示或不显示模板，如下所示:

import { Directive, Input, TemplateRef, ViewContainerRef } from '@angular/core';

@Directive({ selector: '[customNgIf]' })
export class CustomNgIfDirective {

    @Input("customNgIf") condition: boolean;

    constructor(
        private templateRef: TemplateRef<any>,
        private viewContainer: ViewContainerRef) {
    }

    ngOnInit() {
        if (condition) {
            this.viewContainer.createEmbeddedView(this.templateRef);
        } else {
            this.viewContainer.clear();
        }
    }
}

您可以这样使用它:

<div *customNgIf="expression">
    Test
</div>