brando brando - 1 year ago 687
TypeScript Question

Angular 2 beta.17: Property 'map' does not exist on type 'Observable<Response>'

I just upgraded from Angular2 beta16 to beta17, which in turn requires rxjs 5.0.0-beta.6. (Changelog here: In beta16 all was working well regarding Observable/map functionality. The following errors appeared after I upgraded and occur when typescript attempts to transpile:

  1. Property 'map' does not exist on type 'Observable' (anywhere where i've used map with an observable)

  2. c:/path/node_modules/rxjs/add/operator/map.d.ts(2,16): error TS2435: Ambient modules cannot be nested in other modules or namespaces.

  3. c:/path/node_modules/rxjs/add/operator/map.d.ts(2,16): error TS2436: Ambient module declaration cannot specify relative module name.

I have seen this question/answer but it does not solve the problem: Observable errors with Angular2 beta.12 and RxJs 5 beta.3

My appBoot.ts looks like this (am already referencing rxjs/map):

///<reference path="./../node_modules/angular2/typings/browser.d.ts"/>
import {bootstrap} from "angular2/platform/browser";
import {ROUTER_PROVIDERS} from 'angular2/router';
import {HTTP_PROVIDERS} from 'angular2/http';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/toPromise';
import {enableProdMode} from 'angular2/core';
import { Title } from 'angular2/platform/browser';

bootstrap(AppDesktopComponent, [

Anybody have any idea what is going haywire?

Answer Source

I upgraded my gulp-typescript plugin to the latest version (2.13.0) and now it compiles without hitch.

UPDATE 1: I was previously using gulp-typescript version 2.12.0

UPDATE 2: If you are upgrading to the Angular 2.0.0-rc.1, you need to do the following in your appBoot.ts file:

///<reference path="./../typings/browser/ambient/es6-shim/index.d.ts"/>
import { bootstrap } from "@angular/platform-browser-dynamic";
import { ROUTER_PROVIDERS } from '@angular/router-deprecated';
import { HTTP_PROVIDERS } from '@angular/http';
import { AppComponent } from "./path/AppComponent";
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/toPromise';
// import 'rxjs/Rx'; this will load all features
import { enableProdMode } from '@angular/core';
import { Title } from '@angular/platform-browser';

bootstrap(AppComponent, [

The important thing being the reference to es6-shim/index.d.ts

This assumes you have installed the es6-shim typings as shown here: enter image description here

More on the typings install from Angular here:!#typings

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download