tree-shaking-server-side-code-2.ts

// This will be used on the client-side
@Injectable({ providedIn: 'root' })
export class ArticleService {
  constructor(private transferState: TransferState) {}

  getArticle(id: string): Observable<Article> {
    const key = makeStateKey<Article>(`article:${id}`);
    const article = this.transferState.get(key, null!);
    return of(article);
  }
}

// This will be used on the server-side
@Injectable()
export class ServerArticleService {
  constructor(private http: HttpClient, private transferState: TransferState) {}

  getArticle(id: string): Observable<Article> {
    return this.http.get<Article>(`${environment.apiUrl}/api/article/${params.id}`).pipe(
      tap(article => {
        const key = makeStateKey<Article>(`article:${id}`);
        this.transferState.set(key, article);
      }),
    );
  }
}

@NgModule({
  providers: [
    {
      provide: ArticleService,
      useClass: ServerArticleService,
    },
  ],
})
export class AppServerModule {}