模板中的局部变量返回null(Ionic)

Question

我正在使用Angular和ionic，并且我试图在模板中读取局部变量，但是当我在离子数字上使用 *ngif时，即使TRUE，数据也不可用。如何解决这个问题？还是一个错误？

请打开我的抢劫者，然后单击按钮，以查看本地变量P2由于 *ngif ...

而不会返回

请参见Plunker代码样本问题

模板上的摘要

<ion-content class="has-header">
  <div padding style="text-align: center;">
    <h1>Ionic 2 Test</h1>
  </div>
  <ion-item >
    <p #p1>10</p>
  </ion-item>
  <ion-item *ngIf='visible'>
    <p #p2>20</p>
  </ion-item>
  <button block (click)='show(p1?.textContent,p2?.textContent);'> Click-me and you'll see that p2 does not recover </button>
  <ion-item>
    <p style='text-align: center;'>{{ backtemplate }}</p>
  </ion-item>
</ion-content>

组件上的简单功能

show(p1,p2){
  this.backtemplate = p1+' AND '+p2;
}

Answer 1

正在测试代码的所有可能性，并使用[*ngIf]="visibile"而不是*ngIf="visible"解决了问题。

现在问题是我无法解释为什么它是这样工作的，对此很抱歉，但是代码正常。