角4「英雄教程」與「templateUrl」綁定問題，「NgIf」

我一直都在角4教程和我來到這裏角4「英雄教程」與「templateUrl」綁定問題，「NgIf」

https://angular.io/tutorial/toh-pt3

我跟所有的步驟忠實的，除了1件事：我真的不喜歡把HTML寫入JS或TS。

所以我的「英雄詳細信息」部分應該是這樣的：

@Component({ 
    selector: 'hero-detail', 
    template: ` 
    <div *ngIf="hero"> 
     <h2>{{hero.name}} details!</h2> 
     <div><label>id: </label>{{hero.id}}</div> 
     <div> 
     <label>name: </label> 
     <input [(ngModel)]="hero.name" placeholder="name"/> 
     </div> 
    </div> 
    ` 
})

但它看起來是這樣的：

@Component({ 
    selector: "hero-detail", 
    templateUrl: "./templates/heroes_detail.html", 
    styleUrls: ["./css/heroes_detail.css"] 
})

當然，我創建的匹配HTML

<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>

THE ISSUE

問題是，如果我使用「模板」它的作品，但如果我使用「templateUrl」它不！

是否有任何像Angular1範圍和ngIf的問題？

來源

2017-09-06 Tony Samperi

您是否收到任何錯誤？你有沒有在你的.ts文件中用selectedHero改變英雄變量？ – porgo

哎！你是對的...我錯過了更換：D –

@porgo如果你想回答我可以選擇你的答案 –

你在你的HTML文件變英雄可變進selectedHero。在您的組件.ts文件中更改它。

來源

2017-09-06 09:11:05 porgo

這裏的問題

<hero-detail [hero]="selectedHero"></hero-detail>

這使得在「英雄」「selectedHero」。所以在HTML我必須使用hero而不是selectedHero

希望這有助於

來源

2017-09-06 09:06:49

角4「英雄教程」與「templateUrl」綁定問題，「NgIf」

回答

相關問題