角度通用视图源未显示来自asp.net Web API核心的数据

Question

Angular code to load the data

 constructor(private http: HttpClient , private _title: Title,
    private _meta: Meta) {

    this.facts =   this.http.get('https://non-ssr-angular.firebaseio.com/facts.json');
    this.posts =   this.http.get(`${this.baseURL}/api/post/ByMemberAsync/0/None`);
  }

Code to list which is returned API

 <ul> <li *ngFor="let fact of facts | async"> {{fact.text}} </li> </ul> <ul> <li *ngFor="let post of posts | async"> {{post.title}} </li> </ul> <!-- end snippet -> When I view source through the browser it shows list only from (https://non-ssr-angular.firebaseio.com/facts.json) and wen API response show empty. Output <!-- begin snippet: js hide: false console: true babel: false --> 

Please help anyone to fix it

Answer 1

can you try out like this , you might get element in view source

<ul *ngIf="posts">
  <li *ngFor="let post of posts | async">
    {{post?.title}}
  </li>
</ul>

Answer 2

Be sure

in your app.module.ts

import { HttpClientModule} from '@angular/common/http'
@NgModule({
  declarations: [
    ...
  ],
  imports: [
    ....
    HttpClientModule,
  ],
  providers: [...],
  bootstrap: [AppComponent]

})

in your component.ts

import {HttpClient} from '@angular/common/http';
...
export class myComponent {
   facts:any;
   posts:any;
constructor(..){}

It's work for me: Angular CLI version (1.6.6)

Answer 3

 import {HttpClient} from '@angular/common/http';
 ...
 facts:any=[];
 this.http.get('https://non-ssr-angular.firebaseio.com/facts.json').subscribe(data=>
 {this.facts=data});