首页 文章

将使用http的angular 2服务中的数据传递给组件

提问于
浏览
2

我有一个从服务调用函数的组件 .

export class ZoomComponent { 
    constructor(private productService: ProductService){}
     container: any;
     product:ProductObj[];
    ngOnInit() {
      this.product = this.productService.getProduct()
    }
 }

在服务中,我有一个带有订阅的http调用 . 我希望http请求的结果重新调整到我的组件 .

@Injectable()
export class ProductService {   

    product:ProductObj[];
    constructor(private http: Http) { }

     getProduct() {         
        return this.http.get('./friends.json').map((res:Response) => res.json()) .subscribe(
                data => this.product = data
                //function(data){console.log(data)}
            )       
        }   
}

我是angular2的新手 . 我希望返回的产品变量作为我的组件上的http请求的结果 . 但是在给出console.log的同时,observable对象返回了我的响应数据

1 回答

  • 3
    @Injectable()
    export class ProductService {   
        constructor(private http: Http) { }
    
        getProduct() {         
           return this.http.get('./friends.json')
             .map((res:Response) => res.json())     
        }   
    }
    

    在组件中:

    constructor( private productService: ProductService) {}
    
    ngOnInit() {
        this.productService.getProduct().subscribe(
           data => console.log(data)
        )
    }
    

相关问题