Angular(服务提供商)

时间:2018-07-26 19:24:08

标签: angular question2answer

请帮助我。 我正在开发具有离子,角度,科尔多瓦的混合应用程序,并且创建了一个名为piecesservice的服务

import {Injectable} from "@angular/core";
import {HttpClient} from "@angular/common/http";
import {Observable} from "rxjs";

@Injectable()
export class PiecesService {
 private donnes: any;


constructor(public http: HttpClient) {
  }

 getCote(nomCote, nomRobot) {
this.http.get('./assets/etat_pieces.json').subscribe(
  data => {
    this.donnes = data;
    console.log(this.donnes);
    for (var i = 0; i < this.donnes.cote.length; i++) {
      if (this.donnes.cote[i].nom = nomCote) {
        for (var j = 0; j < this.donnes.cote[i].robots.length; j++)
          if (this.donnes.cote[i].robots[j].nom = nomRobot) {
            console.log(this.donnes.cote[i].robots[j].pieces);
            return this.donnes.cote[i].robots[j].pieces;
          }
      }
    }
    return this.donnes;
  });
 }
}

和一页pieces.ts

import { Component } from '@angular/core';
import {PiecesService} from "../services/pieces-service";
import { NavController, LoadingController } from 'ionic-angular';
import {Observable} from "rxjs";
//import {HttpClient} from "@angular/common/http";
@Component({
 selector: 'page-pieces',
 templateUrl: 'pieces.html'
  })
 export class PiecesPage {
 info:any;

 constructor(public nav: NavController, public piecesService: PiecesService) {

  this.info = piecesService.getCote("Gauche", "Robot 2 DC 0912");
  console.log(this.info);

    }

  }

..问题是我无法从console.log(this.info);中未定义的服务中读取pieces.ts中的数据。

请帮助我。

4 个答案:

答案 0 :(得分:2)

1)首先在服务文件中创建功能,例如

public getAll(actionUrl: string): Observable<any[]> {
  return this.http.get<any[]>(API_URL + actionUrl);
}

其中(API_URL =基本网址)

从组件文件中调用该函数,如

this.piecesService.getAll('./assets/etat_pieces.json')
  .subscribe((response: any) => {
    console.log(response.data);
  });

现在您可以获得结果。

答案 1 :(得分:1)

用地图替换在PiecesService中的订阅,然后在Pieces.ts中替换

 piecesService.getCote("Gauche", "Robot 2 DC 0912").subscribe(value => this.info = value);

答案 2 :(得分:-1)

您的函数getCote不返回任何内容。通常,只有在要使用数据的位置时才调用subscribe,并且应该在getCote函数中返回observable,然后在组件中进行订阅。或使用异步管道。

您可以在可观察的对象上使用map函数在另一部分代码订阅数据之前转换数据。

您的代码可能如下所示:

pieces.service.ts

getCote(nomCote, nomRobot) {
  return this.http.get('./assets/etat_pieces.json').map(
    data => {
      this.donnes = data;
      console.log(this.donnes);
      for (var i = 0; i < this.donnes.cote.length; i++) {
        if (this.donnes.cote[i].nom = nomCote) {
          for (var j = 0; j < this.donnes.cote[i].robots.length; j++)
            if (this.donnes.cote[i].robots[j].nom = nomRobot) {
              console.log(this.donnes.cote[i].robots[j].pieces);
             return this.donnes.cote[i].robots[j].pieces;
            }
        }
      }
      return this.donnes;
  });
}

pieces.component.ts

piecesService.getCote("Gauche", "Robot 2 DC 0912")
  .subscribe(info => console.log(this.info));

您可能可以使用map / filter / reduce清除我添加的map函数中的代码(更多信息here)。或者至少通过使用foreach循环。我不确定为什么将数据存储在this.donnes上,但是也许您正在尝试对其进行缓存...

答案 3 :(得分:-1)

尝试使用 async / await ,或者仅返回可观察的http并将其订阅到UsedComponent(Page Pieces.ts)