'toaster-container' is not a known element

[lawrence31983]

I'm trying to add this to my existing app.
The steps that i've done.

1. run npm install angular2-toaster
2. add import {ToasterModule} from 'angular2-toaster' to the app.module.ts file
3. add ToasterModule.forRoot() inside the @NgModule > imports:
4. In app.component.html file I add <toaster-container [toasterconfig]="config">

app.component file
<app-navigation *ngIf="user" (userLogout)="userLoggedOut($event)" >

the component shows the given title error. but app compiles no toasts work though.

5. In app.component.ts add config and needed import

public config: ToasterConfig =
new ToasterConfig({
showCloseButton: true,
tapToDismiss: false,
timeout: 10000
});

6. In client.component.ts I inject the ToasterService in the constructor as well as adding a method to call the service.
   constructor(toasterService: ToasterService) { this._toasterService = toasterService }

   popToast() {
   this.toasterService.pop('success', 'Args Title', 'Args Body');
   }

7. In the client.component.html I added a test button that calles the popToast() in step 6..

As I said besides the red squiggle given by vscode that says "'toaster-container' is not a known element" I have no errors. The code compiles and when I run it i can hit the debug that calls the method but I dont see a toast pop up. Any suggestions?
If you need any further code or information please let me know.
Thank you for your time.