Angular ngIf不使用ng模板

我想根据Angular 4中的布尔值显示或隐藏模板。下面是HTML和代码

---这在Home.Component.HTML中

<ng-template [ngIf]="isSummaryViewVisbile" #pricebookView ></ng-template>

上面的代码不起作用，它总是隐藏模板，尽管我将其赋值为true

---

提前谢谢

ng模板是用于呈现HTML的角度元素。它从不直接显示。事实上，在呈现视图之前，Angular会用注释替换视图及其内容。如果没有structural指令，而您只是将某些元素包装在ng模板中，则这些元素将消失

<p>Hip!</p>
<ng-template>
  <p>Hip!</p> //would disappear
</ng-template>
<p>Hooray!</p>

嘻哈

嘻嘻
 //会消失
万岁

所以下面的代码可以正常工作

isSummaryViewVisbile = true;

<ng-template [ngIf]="isSummaryViewVisbile" #pricebookView >
       Hello world.
</ng-template>

isSummaryViewVisbile=true；
你好，世界。

但如果将[ngIf]替换为*ngIf，则相同的代码将不起作用

因为在内部，Angular将*ngIf属性转换为一个ng模板元素，该元素被包装在宿主元素周围。比如说

<ng-template *ngIf="isSummaryViewVisbile" #pricebookView >
       Hello world.
</ng-template>

你好，世界。

将转换为-

<ng-template [ngIf]="isSummaryViewVisbile">
      <ng-template #pricebookView >
           Hello world.
    </ng-template>
</ng-template>

你好，世界。

现在我们可以看到，内部ng模板将始终隐藏其内容。我希望这能说明问题

---

演示：

您有

isSummaryViewVisbile

，您确定其中一个没有命名为

isSummaryViewVisible

（注意“visible”的正确拼写）很抱歉，拼写不正确，但在两个文件中都是相同的。为什么不使用正是为此目的引入的

？这里是一个plunker。我已经复制了你的代码，它工作得很好。

<ng-template [ngIf]="isSummaryViewVisbile">
      <ng-template #pricebookView >
           Hello world.
    </ng-template>
</ng-template>