Angular 2将价值传递给服务

Question

我知道如何在嵌套组件之间传递数据。但是我有一个从 REST API 获取一些数据的服务。当我单击并运行函数时，我需要更改服务中的 URL。我需要将 ID 传递给我的服务并更改我的 URL。

我是我的组件：

showUnitDetails(selectedUnit) {
    this.unitId = selectedUnit;
    this.unitDetails = true;
    this._unitService.getUnit(this.unitId).subscribe(resUnitData => this.unit = resUnitData, err => alert('Error'));
}

在我的服务中：

getUnit(id: unitId){
    return this._http.get(this._url).map((response: Response) => response.json());
}

但是当我保存我的服务时，我收到了错误"Cannot find name unitId"。

Answer 1

我给你做了一个简单的例子，展示了如何连接组件和 http 服务以及你可以传入 id 和 url 的参数。

模块：

import { NgModule } from "@angular/core"

//A Module
@NgModule({
  declarations: [MyComponent],
  providers: [MyService],
})
export class MyModule {}

组件：

import { Component } from "@angular/core"
import { MyService } from 'path-to-service';

//The Component
@Component({
  selector: 'my-component',
  templateUrl: './my-component.component.html',
})

export class MyComponent {
  private id: number;
  private url: string;

  constructor(public myService: MyService) {}

  ngOnInit() {
    this.id = 123;
    this.url = '/api/stuff';

    this.myService
      .getStuff(this.id, this.url)
      .subscribe(response => {
          console.log(response);
        },
        error => {
          console.log(error);
        })
  }
}

服务：

import { Injectable } from '@angular/core';
import { Http } from "@angular/http"

//The Service
@Injectable()
export class MyService {
  constructor(private http: Http) {}

  getStuff(id: number, url: string) {
    const urlWithId = url + id;

    return this.http
      .get(urlWithId)
      .map(res => res.json())
  }
}