title: Retrieve html from server and display with Angular
body: <p>I'm trying to retrieve HTML from a REST service and display it using Angular (4.3). I can watch the service get called and return the correct content. However, the angular component using this never seems to actually receive the content. What have I missed?</p>
  
  <p>Specifically a <code>console.log(html)</code> (in the second code sample below) always outputs null.</p>
  
  <p>I have an angular service that looks like:</p>
  
  <pre><code>@Injectable()
  export class SlidesService {
  
      private requestUrl: string;
  
      constructor(
          @Inject(AppConfig) private config: AppConfig,
          @Inject(HttpClient) private http: HttpClient) {
          this.requestUrl = this.config.restRoot + listSlidesUrl;
      }
  
  
      getSlide(deck: string, slide: string): Observable&lt;string&gt; {
  
          const headers: HttpHeaders = new HttpHeaders({'Accept': 'text/html'});
          const thisUrl: string = this.requestUrl + '/' + deck + '/' + slide;
  
          return this.http.get&lt;string&gt;(thisUrl, { headers: headers });
      }
  }
  </code></pre>
  
  <p>This is used by a component:</p>
  
  <pre><code>export class SlidePreviewComponent implements OnInit {
  
      @Input() slide: string;     /* Identifier for the slide */
      @Input() deck: string;
      slideHtml: string;
  
  
      constructor(private slideService: SlidesService) {
  
        }
  
      ngOnInit(): void {
          this.slideService.getSlide(this.deck, this.slide)
              .subscribe(html =&gt;  this.setSlideHtml(html) );
      }
  
      setSlideHtml(html: string) {
          this.slideHtml = html;
          console.log(html);
      }
  }
  </code></pre>