12. Templates

When write templates in our components?

Not always a bad thing, when small enough, better to define it here. Just take this file with you. If put template in separate file, have to remember to copy both files.

if becomes large, better to put in separate file for separation of concerns.

add new file favorite.template.html

favorite.template.html

Move template to this file

  <i
    class="glyphicon"
    [class.glyphicon-star-empty]="!isFavorite" 
    [class.glyphicon-star]="isFavorite"
    (click)="onClick()">
  </i>

favorite.component.ts

@Component({
  selector: 'favorite',
  templateUrl: 'app/favorite.template.html' // note that template path starts from root of application. Will cause extra http request first time
})