Angular 2-Abonnement, das leeres Objekt zurückgibt

Question

Ich kann Daten in meiner Vorlage nicht wiedergeben, seit Eigenschaft: product = {} leeres Objekt zurückgibt.

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 zeigt null. Obwohl ich "p" innerhalb des Abonnements logge, gibt leeres Objekt zurück. Aber nur nicht außerhalb des Abonnements. Ich bin nicht in der Lage, Produktdaten auf Vorlage auch wegen dieses leeren Objekts zu erhalten.

TEMPLATE --->

<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 !!

Unten ist mein Product

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

wie Try this:

Druck der Konsole innerhalb der abonnieren Methode

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