Не удается разрешить все параметры для SiteNotificationComponent: (?)

Question

Я хочу добавить компонент в DOM, но получаю ошибку. Не удается разрешить все параметры для SiteNotificationComponent: (?). At syntaxError.

В основном я пытаюсь добавить html-контент, вызывая showNotification () внутриdiv («одна панель») в другом компоненте.

Вот мой note.component.ts

import { Component, OnInit, ElementRef, ViewChildren, ViewChild, QueryList } from '@angular/core';
import {NotificationsService} from '../cid-site-notification.service';
import { Subscription } from 'rxjs/Subscription';
import { CidSiteNotificationModel} from '../cid-site-notification.model';

@Component({
  selector: 'cid-site-notification',
  templateUrl: './site-notification.component.html',
  styleUrls: ['./site-notification.component.css']
})
export class SiteNotificationComponent implements OnInit {
  notificationsData: CidSiteNotificationModel;
  @ViewChildren('notification') private notificationsElements:  QueryList<ElementRef>;
  notifications: String[];
  type : String;
  message : String;
  icon : String;
  on : Boolean;
  duration: String;
  parentClass: any;

  constructor(private notificationsService: NotificationsService) {
  }

  ngOnInit() {
    this.notificationsData = this.notificationsService.getNotificationData() ? this.notificationsService.getNotificationData() : null;
    this.type = this.notificationsData ? this.notificationsData.type : '';
    this.message = this.notificationsData ? this.notificationsData.message : 'hello';
    this.icon = this.notificationsData ? this.notificationsData.icon: '';
    this.on = this.notificationsData ? this.notificationsData.autoclose.on: false;
    this.duration = this.notificationsData ? this.notificationsData.autoclose.duration : '1000';
  }
  
  ngAfterViewInit() {
    if(this.on){  
      this.notificationsElements.forEach((element)=>{      
        const htmlElement = element.nativeElement as HTMLElement;
        setTimeout(() => htmlElement.setAttribute("style", "display:none;"), this.duration);
      });
    }
  }

  onCloseNotifications(event) {
    event.target.parentElement.style.display = 'none';
  }

}

Вот мой note.service.ts

import { Injectable, ComponentFactoryResolver, Inject, ReflectiveInjector } from '@angular/core';
import { CidSiteNotificationModel} from './cid-site-notification.model';
import { SiteNotificationComponent } from './site-notification/site-notification.component';

@Injectable()
export class NotificationsService {
    notificationData: CidSiteNotificationModel;
    factoryResolver: any;
    rootViewContainer: any;

    constructor(@Inject(ComponentFactoryResolver) factoryResolver) {
        this.factoryResolver = factoryResolver
    }
    setRootViewContainerRef(viewContainerRef) {
    this.rootViewContainer = viewContainerRef
    }

    showNotification(obj) {
        this.notificationData = obj;
        const factory = this.factoryResolver
        .resolveComponentFactory(SiteNotificationComponent);
        const component = factory
        .create(this.rootViewContainer.parentInjector)
    }

    getNotificationData(){
        return this.notificationData;
    }

}

Вот мой note.component.html

<div #notification class="notification-top-bar" [ngClass]="type" style="display: block;">
    <span *ngIf= "icon"><img [src]="icon"></span>
    {{message}}  
    <a class="close glyphicon glyphicon-close" (click)="onCloseNotifications($event)"></a>
  </div>

Вот мой note.module.ts

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { SiteNotificationComponent } from './site-notification/site-notification.component';
import { NotificationsService } from './cid-site-notification.service';
import { RouterModule} from '@angular/router';
import {CidContainerModule} from '../cid-container/cid-container.module';


@NgModule({
  imports: [
    CommonModule, RouterModule, CidContainerModule
  ],
  providers: [NotificationsService],
  declarations: [SiteNotificationComponent],
  exports: [SiteNotificationComponent]
})
export class CidSiteNotificationModule {
 }

Вот мой note.model.ts

export class CidSiteNotificationModel {
    type?:String;
    message:String;
    icon?:String;
    autoclose?: {
      on:Boolean,
      duration:String
    };
    event?:Event;
  }

Answer 1

Вы должны добавить NotificationsService в массив поставщиков вашего модуля:

@NgModule({
  // ...
  providers: [
    NotificationsService
  ]
})
export class NotificationModule {}