Angular 2订阅返回空对象

Question

我无法在我的模板中呈现数据，因为property：product = {}是 返回空对象。

ProductComponent.ts --->

{ 
    category$; 

    product={}; 

    id; 

    constructor(

     private router:Router, 

     private route:ActivatedRoute, 

     private categoryService:CategoryService, 

     private productService:ProductService) 

     { 

     this.category$= categoryService.getCategories(); 

     this.id=this.route.snapshot.paramMap.get('id'); 

     if(this.id)   
      this.productService.getProduct(this.id).take(1) 
      .subscribe(p=>this.product=p);  

     console.log(this.product) 
     } 

this.product被示出为空。虽然当我在订阅内登录“p”时， 正在返回空对象。但只是不在订阅之外。 我无法获取模板上的产品数据也是因为此空的 对象。

模板--->

<label for="title">Title</label> 
    <input #title="ngModel" [(ngModel)]="product.title" name="title" 
    id="title" type="text" class="form-control" required> 
    <div class="alert alert-danger" *ngIf="title.touched && title.invalid"> 
     Title is required 
    </div> 

HELP！

下面是我ProductService

import { AngularFireDatabase } from 'angularfire2/database'; 
import { Injectable } from '@angular/core'; 

@Injectable() 
export class ProductService { 

    constructor(private db: AngularFireDatabase) { } 

    create(product){ 
    return this.db.list('/products').push(product); 
    } 

    update(productId, product) 
    { 
    return this.db.object('/products/' + productId).update(product); 
    } 
    deleteProduct(productId){ 
    this.db.object('/products/' + productId).remove(); 
    } 
    getAll(){ 
    return this.db.list('/products'); 
    } 
    getProduct(id){ 
    return this.db.list('/products/' + id); 
    } 


} 

Answer 1

尝试这样的：

打印内部控制台的订阅方法

if(this.id) { 
    this.productService.getProduct(this.id).take(1) 
     .subscribe(p => { 
      this.product = p 
      console.log('this.product', this.product); 
     }); 
}