Question

我在View上显示数据时遇到问题，无法在我的阵列上显示迭代的对象。在我的控制台上显示所有没有错误的对象，但我无法使用ngFor

显示

posts.coomponent.ts

import { Component, OnInit } from '@angular/core';
import {Pipe, PipeTransform} from '@angular/core';


import {PostService} from '../posts.service';
import {Post} from '../posts';


@Component({
  selector: 'app-form-posts',
  templateUrl: './form-posts.component.html',
  styleUrls: ['./form-posts.component.css'],
  providers: [PostService]
 })
 export class FormPostsComponent implements OnInit {
 submitted = false;
 posts: Post[] = [];


 constructor(
 private _pService: PostService,
  ) { }

  ngOnInit() {
      this.getAllPost();
  }



  getAllPost() {
   this._pService.getAll().subscribe(
    posts => {
    this.posts = posts  ;
    console.log(this.posts);
    }
  );
  }

  onSave() {
  this.submitted = true;
 }


 }

posts.service.ts

import { Injectable } from '@angular/core';
import {Http, Headers, Response, RequestOptions } from '@angular/http';

import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';
import 'rxjs/add/observable/throw';
import 'rxjs/add/operator/do';
import { Observable } from 'rxjs/Observable';

@Injectable()
export class PostService {
 base: string = 'http://localhost:3000/posts';
 constructor(
    private _http: Http,
 ) {}

 getAll() {
    return this._http.get(this.base)
    .map((response => response.json()));
   }
 }

console results 这在我看来

<li *ngFor="let post of posts">{{post.categoria}}</li>

Answer 1

错字！

而不是复数{{posts.categoria}}使用{{post.categoria}}中的单数<li>

Answer 2

这样做之后的console.log（this.posts）;

你对chrome有什么回应，我希望你改变这一行帖子：帖子[] = []; 对此公开帖子：any = []; 在posts.coomponent.ts

中

数据绑定Angular 2 [object object]在视图中不显示

2 个答案: