*具有动态变量-Angular2的ngIf

我是安格拉尔的新手！ 我遵循这个例子：

当

selectedHero

为空时，不应显示div元素，这样可以正常工作， 但当我使用click event选择英雄时，

selectedHero

不为空 div元素仍不显示， 我也尝试过使用布尔变量，但在更改click事件后，该变量被更新，但div元素仍然没有显示

  <ul>
    <li *ngFor='let hero of myHeroes' (click)="onSel(hero)">
      <div><label>id: </label>{{hero.id}}</div>
      <div><label>Name: </label>{{hero.name}}</div>
    </li>
  </ul>
</div>
<div *ngIf="selectedHero">
  <h2>{{selectedHero.name}} details!</h2>
  <div><label>id: </label>{{selectedHero.id}}</div>
  <div>
    <label>name: </label>
    <input [(ngModel)]="selectedHero.name" placeholder="name" />
  </div>

---

您缺少从定义了

ngIf

的

@angular/core

导入的一些内容

看

---

ngIf

不起作用的原因是创建的内容不是有效的html

问题出在模板中，ul元素应该在div中，否则代码不起作用，请告诉我原因，谢谢

    <div>
      <ul>
        <li *ngFor='let hero of myHeroes' (click)="onSel(hero)">
          <div><label>id: </label>{{hero.id}}</div>
          <div><label>Name: </label>{{hero.name}}</div>
        </li>
      </ul>
    </div>

<div *ngIf="selectedHero">
  <h2>{{selectedHero.name}} details!</h2>
  <div><label>id: </label>{{selectedHero.id}}</div>
  <div>
    <label>name: </label>
    <input [(ngModel)]="selectedHero.name" placeholder="name" />
  </div>
</div>

id:{{hero.id}
姓名：{{hero.Name}


{{selectedHero.name}}详细信息！
id:{{selectedHero.id}
姓名：

设置

selectedHero

的代码是什么？onSel（shero:Hero）：void{this.selectedHero=shero；//alert（this.selectedHero.name）；}，这是单击事件模板单击事件的代码是什么样子的？重新检查代码，我已经更新了它到目前为止一切正常。HTML的顶部是AppComponent模板的一部分还是另一个组件/指令？我唯一的导入是从'@angular/core'导入{component}；我是否需要任何导入来使用ngIF指令？也尝试过这些！仍然不工作………从“@angular/core”导入{Component，NgModule}；从“@angular/platform browser”导入{BrowserModule}；从'@angular/forms'导入{FormsModule}；谢谢，问题出在模板中，显示的列表应该在模板中，否则代码不起作用