Angular 2 interface for service
You can achieve this via dependency injection.
As you said, create two different services implementing same ISearchService
interface.
When using SearchComponent
, provide appropriate service class from module to ServiceComponent
.
Your SearchComponent
would look like
constructor(private searchService: ISearchService) {}
And when using SearchComponent
at different places provide service instance:
providers: [
{ provide: ISearchService, useValue: SearchInMaleEmployeeService}
]
or
providers: [
{ provide: ISearchService, useValue: SearchInFemaleEmployeeService}
]
More information about Angular2 dependency injection here.
Update:
As pointed out by Ben
Provide statement needs to be coded as
provide('ISearchService', {useClass: SearchInMaleEmployeeService})
And to inject the class to component:
constructor(@Inject('ISearchService') private searchService:ISearchService) {}
Yes, you can do it like Sefa Ümit Oray answered above. But as I understand, you are trying to filter two type of object in list and you want to use both. So why you don't write a service that has two difference search methods. Or you can write a method that do search in both types of object.
As you ask, you can use instance of
to check the type of object. Then, use Pipe
combine with ngIf
to do render what you want.
https://angular.io/docs/ts/latest/guide/pipes.html https://angular.io/docs/ts/latest/api/common/index/NgIf-directive.html