Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/angular/31.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 在10中遍历HttpClient上的导线后,返回toString()将丢失类型_Javascript_Angular_Typescript_Rxjs - Fatal编程技术网

Javascript 在10中遍历HttpClient上的导线后,返回toString()将丢失类型

Javascript 在10中遍历HttpClient上的导线后,返回toString()将丢失类型,javascript,angular,typescript,rxjs,Javascript,Angular,Typescript,Rxjs,我用一个toString()创建了一个Foobar类,除了从rest调用返回Foobar外,它工作得很好。下面是代码和输出。FOOBAR-1按预期工作,但FOOBAR-2不返回字符串,而是返回对象。为什么?FOOBAR-3按预期返回,因此它知道这是一个FOOBAR app.component.ts import { HttpClient } from '@angular/common/http'; import { Component, ViewChild } from '@angular/co

我用一个toString()创建了一个Foobar类,除了从rest调用返回Foobar外,它工作得很好。下面是代码和输出。FOOBAR-1按预期工作,但FOOBAR-2不返回字符串,而是返回对象。为什么?FOOBAR-3按预期返回,因此它知道这是一个FOOBAR

app.component.ts

import { HttpClient } from '@angular/common/http';
import { Component, ViewChild } from '@angular/core';
import { Foobar } from './foobar';
import { Observable } from 'rxjs';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {

  constructor(private http: HttpClient) {
  }

  ngAfterViewInit() {

    console.log("FOOBAR-1 IS " + new Foobar().toString());
    const remoteUrl:string = 'http://localhost:8080/foobar';
    let observable:Observable<Foobar> =  this.http.get<Foobar>(encodeURI(remoteUrl));  
    observable.subscribe(
      (foobar: Foobar) => {
        console.log("FOOBAR-2 IS "+foobar.toString());
        console.log("FOOBAR-3 IS "+foobar.foo);
      }
    );
  }
}
控制台输出:

app.component.ts:18 FOOBAR-1 IS bar
app.component.ts:23 FOOBAR-2 IS [object Object]
app.component.ts:24 FOOBAR-3 IS bar

可以对从HttpClient返回的任何对象使用toString()吗?这里发生了什么?

HTTP调用只能返回字符串,在您的例子中,可能是JSON字符串
'{“foo”:“bar”}
。它未序列化到Javascript对象
{foo:'bar'}
。该对象的行为与您演示的完全相同:

constfoobar={foo:'bar'};
log(“FOOBAR-2是”+FOOBAR.toString());

console.log(“FOOBAR-3是”+FOOBAR.foo)
您可以使用
JSON.stringify(obj)
来序列化对象。这是从Java的范式转变。我知道我有JSON表示,但是我需要实例化一个Foobar?正确的方法是什么?唯一真正的方法是让您的
Foobar
接受一个普通对象作为参数,并从中获取其值,或者使用工厂函数/方法。看看有没有灵感。可能有很多方法可以利用原型链之类的东西来基本上铸造现有的对象,使其表现得像一个实例;但是,一旦类在构造函数中实际执行操作并尝试保持特定状态等,那么这很容易出错。
app.component.ts:18 FOOBAR-1 IS bar
app.component.ts:23 FOOBAR-2 IS [object Object]
app.component.ts:24 FOOBAR-3 IS bar