角2 HTTPリクエストの問題

Question

本当に誰かが私を助けることを願っています。

私がしようとしていること：jsonのREST APIを呼び出し、Angular 2約束を解決します。 Node.js/ExpressJS/Lodash

Server.jsファイル実行

ServerAPI：

var express = require('express'); 
var app = express(); 
var bodyParser = require("body-parser"); 
var data = require('./data.json'); 
var _ = require('lodash'); 
var cors = require('cors'); 


app.use(bodyParser.urlencoded({ extended: false })); 
app.use(cors()); 


app.get('/GetData', function (req, resp) { 

if (req.query.search != null) { 

    var result = _.find(data, function (o) { 
     return o.value === req.query.search.toLowerCase().trim() 
    }); 

    return resp.send(result) 

} 

}); 

    app.listen(1337, function() { 
    console.log('Listening at Port 1337'); 
}); 

を試験としてhttp://localhost:1337/GetData?search=coloradoを実行し、vaild JSONオブジェクトを返します。

import {Injectable} from "@angular/core"; 
import {Http} from "@angular/http"; 
import {Config} from "../config"; 
import {SearchResult} from "../models/search-result.model"; 
import {MockSearchData} from "../mock/mock-search-results"; 
import {Observable} from 'rxjs/Rx'; 
import 'rxjs/add/operator/map'; 


@Injectable() 
export class ApiDataService { 

    constructor(private http:Http) { 
    } 

    public  performSearchRequest(searchTerm:string,queryType:string):Promise<SearchResult[]>  { 
    return new Promise<SearchResult[]>((resolve, reject) => { 

     let url = Config.apiBaseUrl + Config.searchApi; 
     url += "?search=" + searchTerm; 

     console.log("Your query to be: " + url); 

     if (searchTerm != "") { 

      if (queryType == 'mock') { 

       resolve(MockSearchData); 


      } else if (queryType == 'api') { 

       let data = []; 

       this.http.get(url) 
        .map(resp => resp.json()) 
        .subscribe(getData => data = getData); 

       resolve(data); 

      } else { 

       reject("No query type found."); 

      } 

     } else { 

      reject("Please enter a search term."); 

     }; 

    }); 
} 
} 

ClientAPI内のローカルJSONファイルが完全に動作しているモックデータの決意：HTTPリクエストを呼び出し

ClientAPI

サービスファイル。私はapiのクエリ型が機能するためのif関数を取得する必要があります。

角度アプリは問題なく起動し、エラーなしでhttp.getを実行します。私はdevツールの下のネットワークタブをチェックして、HTTPリクエストが完了し、その応答が返されることを確認することができます。しかし、私がこれを解決しているテーブルは空白です。

私は間違って何をしていますか？

Answer 1

問題がここに発生します。

this.http.get(url) 
    .map(resp => resp.json()) 
    .subscribe(getData => data = getData); 

resolve(data); 

あなたは、観察を購読するが、それが「解決」されていない、まだあなたが直接その後resolveを呼び出すとき。つまり、実際にはresolve([])と呼んでいます。

this.http.get()./*...*/.subscribe(result => resolve(result)); 

あなたはまた、観測上のtoPromise方法だけでなく、直接解決の約束を構築する方法を検討することをお勧めします：

代わりに、このような何かを行います。