Unexpected closing tag Angular2

Question

Im learning Angular2 with typscript and im stuck after first changes. Here is my problem. My code is:

import { Component } from '@angular/core';

@Component({
    selector: 'pm-app',
    template: `
        <div><h1>{{pageTitle}}</h1>
            <pm-prudcts></pm-products>
        </div>
    `
})
export class AppComponent {
    pageTitle: string = 'Acme Product Manager';
}

And im getting error with Component Products and div tag:

Template parse errors:
Unexpected closing tag "pm-products" ("
        <div><h1>{{pageTitle}}</h1>
            <pm-prudcts>[ERROR ->]</pm-products>
        </div>
    "): AppComponent@2:24
Unexpected closing tag "div" ("
        <div><h1>{{pageTitle}}</h1>
            <pm-prudcts></pm-products>
        [ERROR ->]</div>
    "): AppComponent@3:8

Answer 1

There is a typo in your component template. Change <pm-prudcts> to <pm-products> :

@Component({
    selector: 'pm-app',
    template: `
        <div><h1>{{pageTitle}}</h1>
            <pm-products></pm-products> 
        </div>
    `
})