javascript - ngIf=false 与 ngContent 仍然加载模板绑定

Question

定义一个简单的组件如下：

@Component({
  selector: 'loader',
  template: `<div *ngIf='false'>
        <ng-content></ng-content>
        </div>`,
})
export class Loader {}

像这样使用它时：

  <loader>
      {{model.something}}
  </loader>

如果模型在父级中未定义，我仍然会收到模板绑定错误，因为它即使使用ngIf=false. 为什么会这样？

Answer 1

因为loader要投射到ngContent元素内部的组件的内部内容会使用当前组件上下文 ( this) 编译一次，即使组件模板没有注入到 DOM 中也是如此。

ng-transclude它的工作方式与Angular 1.X中的工作方式相同

您应该Elvis Operator在此处使用以避免此类问题

<loader>
    {{model?.something}}
</loader>