【问题标题】:Observables with angular 2 isn't working (Http method)角度为 2 的 Observables 不起作用(Http 方法)
【发布时间】:2023-03-26 12:27:01
【问题描述】:

我的服务有问题。我有一个服务,它从 HTTP 模块获取 JSON 并用它填充一个类'olders'。但是当我打电话给我的服务时,它什么也没做,而且我的班级长辈仍然没有定义...... 如果我在 yearbook.component.html 中创建 *ngFor 指令,我什么也得不到…… 我认为我的问题来自我的服务,但我不知道错误在哪里...... 即使我将 console.log 放在订阅中

我的 yearbook.component :

import {Component} from '@angular/core'
import {Olders} from './olders'
import {OldersService} from './olders.service'

@Component({
  moduleId: module.id,
  selector: 'yearbook',
  templateUrl: 'yearbook.component.html',

})

export class YearbookComponent {

  olders : Olders[];

  constructor(
    private _oldersService : OldersService
  ){}


  ngOnInit() {

    this._oldersService.getOldersfromAPI()
                       .subscribe( res => {this.olders = res,
                                           console.log(this.olders)},
                                   err => console.error(err.status)
                                 );


  }
 }

和 olds.service :

import {Injectable} from '@angular/core'
import {Http} from '@angular/http'
import {Olders} from './olders'
import 'rxjs/add/operator/map'
import 'rxjs/add/operator/do'

@Injectable ()

export class OldersService {

  constructor(private _http:Http) {

  }

  getOldersfromAPI(){

    return this._http.get('../CDN/olders.json')
                     .do(x => console.log(x))
                     .map(olders => {olders = olders.json()});
  }
}

提前感谢您的所有回答

【问题讨论】:

  • 这个网址看起来很奇怪'../CDN/olders.json'
  • 最好不要在请求中使用相对路径,使用“完整”路径,从顶层开始(通常是src)。你检查过控制台,有什么错误吗?我猜你会得到那个 url 的 404 错误:)
  • 这与 angular、http 或 observables 无关。这是基本的 JS 异步行为。将console.log 移动到订阅处理程序中,此时数据可用。
  • 这个 url 只是我的 json 的路径,我的控制台没有任何错误,即使是 404 one @AJT_82

标签: javascript angular http observable angular2-services


【解决方案1】:

您的映射中缺少返回语句:

.map(olders => {olders = olders.json()});

应该是:

.map(olders => { return olders = olders.json()});

【讨论】:

  • 非常感谢您的回复。但是我仍然遇到同样的问题,实际上我发现奇怪的是我的控制台在我加载页面时没有显示任何内容,或者 .do 应该在控制台中显示我的 json 没有?
  • 您的代码对我来说似乎很好,现在当我测试它时...您是否检查了响应选项卡并看到您实际上正在获取数据?否则代码看起来很好:plnkr.co/edit/CtPmucjBv9yXa4AnOmMy?p=preview
  • 所以是的...do 应该打印你的数据,所以我怀疑你没有得到任何数据:)
  • 你是说网络一号?我想我什么都没有……我不知道为什么……编辑:网络控制台的链接img4.hostingpics.net/pics/…
  • 是的,我要试试
猜你喜欢
  • 2017-11-11
  • 1970-01-01
  • 1970-01-01
  • 2017-07-27
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多