Question

我有一个service.ts文件在我的Angular组件之间传递一个Observables，我将一个Component上的click事件的结果传递给下面的组件。

我的问题是我可以console.log我想要的对象存储在我的selectedContact变量中（见下文），但是当我尝试分配{{ 1}}响应我的subscribe()变量，然后将其绑定到我的HTML，它只显示为`[object Object]。

这是我的代码：

selectedContact

当我运行时：

import { Component, OnInit } from '@angular/core';
import { AppComponent } from '../app.component';
import { ApiService } from '../api.service';

@Component({
  selector: 'app-contact-details',
  templateUrl: './contact-details.component.html',
  styleUrls: ['./contact-details.component.scss']
})
export class ContactDetailsComponent implements OnInit {

  selectedContact: any[] = [];

  error: string;

  constructor(private _apiService: ApiService) { }

  ngOnInit() { this.showContact() }

  showContact() {
  this._apiService.newContactSubject.subscribe(
    data => this.selectedContact = data)
  }
}

我将正确的对象记录到控制台（来自其他组件的click事件）。

但是当我跑这个时：

  showContact() {
  this._apiService.newContactSubject.subscribe(
    data => console.log(data))
  }

我得到showContact() { this._apiService.newContactSubject.subscribe( data => this.selectedContact = data) }

我错过了什么？感谢!!!

Answer 1

我认为在html中，您将this.selectedContact绑定到某个html组件。但由于this.selectedContact是一个对象，你必须像这样绑定它的属性：{{selectedContact.proppertyName }}

Answer 2

如果你这样做了：

showContact() {
  this._apiService.newContactSubject.subscribe(
  data => this.selectedContact = JSON.stringify(data))
}

...你会看到你的对象，但它的格式不会很好。你需要做更多的工作来获得格式良好的输出。

角度5：从主体可观察到不分配变量

2 个答案: