Angular2 http отсутствует .map функция

Я нашел этот пример кода в учебнике :

getRandomQuote() {
  this.http.get('http://localhost:3001/api/random-quote')
    .map(res => res.text())
    .subscribe(
      data => this.randomQuote = data,
      err => this.logError(err),
      () => console.log('Random Quote Complete')
    );
}

Но, пытаясь использовать его, я получаю только TypeError: this.http.get(...).map is not a function in [null]:

getChannels():Promise<Channel> {
    return this.http.get('...')
        .map(function (response:Response) {
            ...
        }).toPromise();
}

Мой компилятор Typescript сообщает мне, что эти методы доступны, но при проверке возвращаемого значения http.get() они отсутствуют.

Я использовал package.json текущего руководства для angualar2:

"dependencies": {
  "angular2": "2.0.0-beta.0",
  "systemjs": "0.19.6",
  "es6-promise": "^3.0.2",
  "es6-shim": "^0.33.3",
  "reflect-metadata": "0.1.2",
  "rxjs": "5.0.0-beta.0",
  "zone.js": "0.5.10"
},

...

<script src="node_modules/angular2/bundles/angular2.dev.js"></script>
<script src="node_modules/angular2/bundles/http.dev.js"></script>

Любые идеи, что я могу ошибиться на этом этапе?

Ответ 1

Вы хотите, чтобы ваш index.html выглядел примерно так, поэтому system.js может найти все зависимости rxjs, которые вы импортируете в своих компонентах.

        <script src="/lib/anguar2/angular2-polyfills.js"></script>
        <script src="/lib/es6-shim/es6-shim.js"></script>
        <script src="/lib/systemjs/system.src.js"></script>

        <script>
            System.config({
                defaultJSExtensions: true,
                packages: {
                    app: {
                        format: 'register'
                    }
                },
                map: {
                    'rxjs':"lib/rxjs"

                }
            });
        </script>
        <script src="/lib/anguar2/angular2.dev.js"></script>
        <script src="/lib/anguar2/router.dev.js"></script>
        <script src="/lib/anguar2/http.js"></script>
        <script>
            System.import('app/boot');
        </script>

Ответ 2

Observable по умолчанию поставляется с несколькими операторами. Вы должны явно импортировать их:

import 'rxjs/add/operator/map';

или, если вы не хотите об этом думать, просто загрузите все (например, в файл начальной загрузки):

import 'rxjs/Rx';