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.