Açısal 2 beta.17: 'Gözlenebilir <Yanıt>' türünde 'harita' özelliği yok


195

Sadece Açısal 2 yükseltme beta16 için beta17 sırayla rxjs 5.0.0-beta.6 gerektirir. (Değişiklik günlüğü : https://github.com/angular/angular/blob/master/CHANGELOG.md#200-beta17-2016-04-28 ) Beta16'da Gözlemlenebilir / harita işlevselliği ile ilgili her şey iyi çalışıyordu. Yükseltme işleminden sonra aşağıdaki hatalar çıktı ve daktilo dosyası aktarılmaya çalıştığında ortaya çıktı:

  1. 'Harita' özelliği 'Gözlenebilir' türünde mevcut değil (haritayı gözlemlenebilir bir şekilde kullandığım herhangi bir yerde)
  2. c: /path/node_modules/rxjs/add/operator/map.d.ts (2,16): hata TS2435: Ortam modülleri diğer modüllere veya ad alanlarına yerleştirilemez.
  3. c: /path/node_modules/rxjs/add/operator/map.d.ts (2,16): hata TS2436: Ortam modülü bildirimi göreceli bir modül adı belirtemiyor.

Bu soruyu / cevabı gördüm ama sorunu çözmüyor: Angular2 beta.12 ve RxJs 5 beta.3 ile gözlemlenebilir hatalar

Benim appBoot.ts şöyle görünüyor (zaten rxjs / map atıfta bulunuyorum):

///<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';
[stuff]
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/toPromise';
import {enableProdMode} from 'angular2/core';
import { Title } from 'angular2/platform/browser';


//enableProdMode();
bootstrap(AppDesktopComponent, [
    ROUTER_PROVIDERS,
    HTTP_PROVIDERS,
    Title
]);

Herkesin neye gittiğine dair bir fikri var mı?


Yanıtlar:


284

mapOperatörü içe aktarmanız gerekir :

import 'rxjs/add/operator/map'

3
Açısal ekip ve RxJS ekibi, RX'in tamamını bu şekilde içe aktarma yaklaşımını ÖNERMİYOR. Bunu yapmamalısın. Çok büyük. Yukarıdaki ilk cevap gayet iyi, ikincisi o kadar değil. @ 0x1ad2, cevabınızı bu büyük içe aktarmayı ikinci bir seçenek olarak içermeyecek şekilde güncelleyebilir misiniz?
ayaz

2
Bu sezgisel değil. Bu, Açısal 2+ geliştirmede Gözlemlenebilir uygulamaya bağımlılık olarak nerede belgelenir?
Joe

Bu iyonik 3.20.0 için geçerli midir? Aynı sorunu aldım çünkü iyonik haritayı otomatik olarak içe aktarmadı. İçe aktarma açıkça çalışıyor ancak bunun doğru olduğundan emin değilim.
LordDraagon

1
Bu benim için sorunu çok düzeltmez ben rxjs / add / operator / map yerine Boru kullanmak zorunda rxjs / operatörleri boru ve .pipe ile ithalat kullandım (map (res => res.json ()));
codefreaK

Angular 7 kullandığımız ve RXJS'nin bazı değişikliklerden geçtiği bir zamanda bazı Google aramalarından sonra buraya geldim. Yeni yöntem import { map } from 'rxjs/operators', ancak başka bir cevabın daha fazla ayrıntısı var.
Colby Hunter

78

Gulp-typecript eklentimi en son sürüme (2.13.0) yükselttim ve şimdi sorunsuz olarak derliyor.

GÜNCELLEME 1: Daha önce gulp-typescript 2.12.0 sürümünü kullanıyordum

GÜNCELLEME 2: Angular 2.0.0-rc.1 sürümüne yükseltme yapıyorsanız, appBoot.ts dosyanızda aşağıdakileri yapmanız gerekir:

///<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';



//enableProdMode();
bootstrap(AppComponent, [
    ROUTER_PROVIDERS,
    HTTP_PROVIDERS,
    Title
]);

Önemli olan es6-shim / index.d.ts referansıdır

Burada, gösterildiği gibi es6-shim tiplerini yüklediğiniz varsayılmaktadır: resim açıklamasını buraya girin

Yazılar hakkında daha fazla bilgi Angular'dan buradan yüklenir: https://angular.io/docs/ts/latest/guide/typescript-configuration.html#!#typings


Lütfen sorunun yaşandığı eski sürüm numarasından bahseder misiniz? Teşekkürler.
Meligy

1
@Meligy Daha önce gulp-typescript sürüm 2.12.0 kullanıyordum
brando

1
Muhteşem. Hata mesajı ile ilgili makalemi benzer sorunları olan kullanıcılar için bir not içerecek şekilde güncelledimmap . Çok teşekkürler :)
Meligy

1
@Meligy Angular2 RC'ye yükselttiğimde aynı sorunu tekrar yaşadım. Nasıl çözdüğümü göstermek için yukarıdaki cevabımı güncelledim.
brando

6
import 'rxjs/Rx'; // Tüm özellikleri yükler
VahidN

67

Rxjs 5.5 Gözlemlenebilir tipinde “Özellik 'haritası' mevcut değil.

Sorun, tüm operatörlerin etrafına pipo eklemeniz gerektiğiydi.

Bunu değiştir,

this.myObservable().map(data => {})

buna

this.myObservable().pipe(map(data => {}))

Ve

Haritayı böyle içe aktar,

import { map } from 'rxjs/operators';

Sorunlarınızı çözecektir.


3
Bu aynı zamanda Rxjs 6 için de geçerlidir. Baktığım her öğreticide, piposuz harita fonksiyonu var. Ben boru ekledi ve 'rxjs / operatörleri' tam olarak cevap devletleri olarak harita ithal edene kadar bu benim için işe yaramadı.
Keyvan Sadralodabai

Evet, Rxjs 6 için de geçerlidir.
Hiran DA Walawage

41

Benim durumumda sadece harita ve söz vermek yeterli olmaz:

import 'rxjs/add/operator/map';
import 'rxjs/add/operator/toPromise';

Resmi belgelerin önerdiği gibi birkaç rxjs bileşenini içe aktararak bu sorunu çözdüm :

1) İfadeleri bir app / rxjs-operators.ts dosyasına aktarın:

// import 'rxjs/Rx'; // adds ALL RxJS statics & operators to Observable

// See node_module/rxjs/Rxjs.js
// Import just the rxjs statics and operators we need for THIS app.

// Statics
import 'rxjs/add/observable/throw';

// Operators
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/debounceTime';
import 'rxjs/add/operator/distinctUntilChanged';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/switchMap';
import 'rxjs/add/operator/toPromise';

2) Hizmetinizde rxjs-operatörünün kendisini içe aktarın:

// Add the RxJS Observable operators we need in this app.
import './rxjs-operators';

Yine, sorunun en iyi cevabı en çok oyu almıyor. Bu soru için en iyi cevap bu. Paylaşım için teşekkürler. Keşke başkaları buna oy verseydi.
ayaz

26

Bu hatayı VS2015'te görürseniz, burada bahsedilen bir github sorunu ve geçici çözümü vardır:

https://github.com/Microsoft/TypeScript/issues/8518#issuecomment-229506507

Bu, property map does not exist on observablesorunu çözmeme yardımcı oldu . Ayrıca, 1.8.2'nin üzerinde daktilo sürümüne sahip olduğunuzdan emin olun


8
Değiştirme C:\Program Files (x86)\Microsoft Visual Studio 14.0\Common7\IDE\CommonExtensions\Microsoft\TypeScript\typescriptServices.js ile typescriptService (VS 15 için çalıştı dosyayı değiştirdikten sonra vs yeniden başlatma )
tchelidze

yukarıda belirtilen dosyayı değiştirmek benim için de çalıştı
Krishnan

Microsoft'tan hala güncelleme yok ... Neden düzeltmiyorlar?
Piotrek

26

ANGULAR 6 KULLANANLAR İÇİN NİHAİ CEVAP:

* .Service.ts dosyanıza aşağıdaki komutu ekleyin "

import { map } from "rxjs/operators";

**********************************************Example**Below**************************************
getPosts(){
this.http.get('http://jsonplaceholder.typicode.com/posts')
.pipe(map(res => res.json()));
}
}

Windows 10 kullanıyorum;

daktilo ile V açısal6 2.3.4.0


Görünüşe göre artık sadece app.module.ts dosyasına aktaramayacağız. Şimdi her hizmet ve bileşende ithal etmemiz gerekiyor
Adam Mendoza

15
import 'rxjs/add/operator/map';

&

npm install rxjs@6 rxjs-compat@6 --save

benim için çalıştı


13

Açısal 2x

Example.component.ts içinde

import { Observable } from 'rxjs';

Example.component.html

  Observable.interval(2000).map(valor => 'Async value');

Açısal 5x veya Açısal 6x olarak:

Example.component.ts içinde

import { Observable, interval, pipe } from 'rxjs';
import {switchMap, map} from 'rxjs/operators';

Example.component.html

valorAsync = interval(2500).pipe(map(valor => 'Async value'));

1
neden doğrudan harita yerine pipo kullanmamız gerekiyor?
Krish


10

Anladığım kadarıyla rxjsson güncelleme yüzünden . Bazı operatörleri ve sözdizimini değiştirdiler. Bundan sonra böyle rxoperatörleri içe aktarmalıyız

import { map } from "rxjs/operators";

bunun yerine

import 'rxjs/add/operator/map';

Ve bunun gibi tüm operatörlerin etrafına boru eklememiz gerekiyor

this.myObservable().pipe(map(data => {}))

Kaynak burada


9

Justin Scofield'ın cevabında önerdiği gibi, Angular 5'in son sürümü ve Angular 6 için, 1 Haziran 2018'de import 'rxjs/add/operator/map';olduğu gibi, TS hatasını kaldırmak için yeterli değil: [ts] Property 'map' does not exist on type 'Observable<Object>'.

Gerekli bağımlılıkları yüklemek için aşağıdaki komutu çalıştırmak gerekir: npm install rxjs@6 rxjs-compat@6 --savebundan sonra mapiçe aktarma bağımlılığı hatası çözülür!


1

8

Benzer bir hatayla karşılaşıyordum. Bu üç şeyi yaptığımda çözüldü:

  1. En son rxjs güncellemesi:

    npm install rxjs@6 rxjs-compat@6 --save
  2. Haritayı içe aktar ve söz ver:

    import 'rxjs/add/operator/map';
    import 'rxjs/add/operator/toPromise';
  3. Yeni bir içe aktarma ifadesi eklendi:

    import { Observable, Subject, asapScheduler, pipe, of, from, interval, merge, fromEvent } from 'rxjs';

7

Görünüşe göre en son RxJS daktilo 1.8'i gerektirir, bu yüzden daktilo 1.7 yukarıdaki hatayı rapor eder.

Bu sorunu en son daktilo sürümüne yükselterek çözdüm.


tsctsc -v
Komuttan

6

Sürüm 5'ten 6'ya geçerken benzer hata mesajları açılacaktır. İşte rxjs-6'daki değişikliğin cevabı.

Tek tek işleçleri içe aktarın, sonra pipezincirleme yerine kullanın .

import { map, delay, catchError } from 'rxjs/operators'; 

source.pipe(
  map(x => x + x),
  delay(4000),
  catchError(err => of('error found')),
).subscribe(printResult);

6

Açısal4 kullanıyorsanız aşağıdaki kullanımı içe aktarın. İşe yaramalı .

'rxjs / add / operator / map' dosyasını içe aktarın;

Açısal5 / 6 kullanıyorsanız, borulu bir harita kullanın ve bir tanesinin altına aktarın

{map} 'i "rxjs / operatörlerinden" içe aktarın;


1

'map' özelliği 'gözlemlenebilir yanıt' türünde mevcut değil açısal 6

Çözüm: Açısal CLI ve Temel Sürümü Güncelle

ng update @angular/cli           //Update Angular CLi 
ng update @angular/core          //Update Angular Core 
npm install --save rxjs-compat   //For Map Call For Post Method 
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.