我在调用我认为可在全球范围内使用的服务中的函数时遇到问题。我创建了一个名为SavedNotificationService
的服务:
import { Injectable } from '@angular/core';
@Injectable()
export class SavedNotificationService {
private showSavedNotification = false;
show(): void {
this.showSavedNotification = true;
}
hide(): void {
this.showSavedNotification = false;
}
}
我已经在app.module.ts中导入了它:
import { SavedNotificationService } from "./saved-notification.service";
@NgModule({
providers: [SavedNotificationService]
})
但是当我想在服务中调用一个函数时,它说它无法找到它。虽然我已经在app.module上提供了该服务,但是我仍然需要在我想要使用的组件上导入它吗? (如下例所示)
@Component({
providers: [SavedNotificationService]
})
答案 0 :(得分:2)
您必须导入它,然后通过构造函数将其作为依赖项注入组件。
这样的事情:
import { ExampleService } from '....' // where your services are.
@Component({
moduleId: module.id,
selector: 'example-component',
templateUrl: 'example-component.html'
})
export class ExampleComponent implements OnInit {
constructor(private _exampleService: ExampleService) {
}
Here您可以阅读有关注入服务和使用它们的更多信息。
P.S:如果您在全球范围内注册您的服务(AppModule),您将能够在应用程序的任何位置注入它。您也可以在注射范围不同的给定模块中注册您的服务。(您应该小心,因为您可以在给定时间以不同的服务实例结束。)
答案 1 :(得分:1)
在模块中声明服务后,无需在组件中重新声明...只需将其导入组件并在构造函数中初始化为
import { SavedNotificationService } from "./saved-notification.service";
@Component({
})
export class xyz{
service;
constructor(service:SavedNotificationService)
{
}
//call the method using this instance
service.show();
}