Component encapsulation

Angular components need more explicit configuration and some (in some cases confusing) characters in the template. You can put the template in a separate file, or for simpler components, you can include the template inline:

/* product-list.component.ts */
@Component({
    selector: 'product-list',
    template: `<p><product-detail *ngFor="let thing of things" [product]="product" /></p>`
})
export class ProductList {
    public products: Product[];
}