angular2-in-memory-web-api 404 hatası

Question

Bu kılavuzda 5 dakikalık uygulamayı 5 numaralı açı ile oluşturmaya çalışıyorum: https://angular.io/docs/ts/latest/tutorial/toh-pt6.html.

http bölümünde sahte bir sunucu ekledim ancak angular2-in-memory-web-api olduğu için 404 hatası alıyorum.

http://localhost:4200/vendor/angular2-in-memory-web-api/in-memory-backend.service.js 
Failed to load resource: the server responded with a status of 404 (Not Found) 

bu cevabı takip etmeye çalışıyordum: Angular2 Tutorial (Tour of Heroes): Cannot find module 'angular2-in-memory-web-api'

Ama açısal-cli kullanmıyordu + nerede onlar orada hakkında konuştuk bu bağımlılıkları eklemek için bir ipucu yok.

Benim main.ts:

// Imports for loading & configuring the in-memory web api 
import { XHRBackend } from '@angular/http'; 

import { InMemoryBackendService, SEED_DATA } from 'angular2-in-memory-web-api'; 
import { InMemoryDataService }    from './app/in-memory-data.service'; 

// The usual bootstrapping imports 
import { bootstrap } from '@angular/platform-browser-dynamic'; 
import { enableProdMode } from '@angular/core'; 
import { AppComponent, environment } from './app/'; 
import { APP_ROUTER_PROVIDERS } from './app/app.routes'; 
import { HTTP_PROVIDERS } from '@angular/http'; 
if (environment.production) { 
    enableProdMode(); 
} 

bootstrap(AppComponent, [ 
    APP_ROUTER_PROVIDERS, 
    HTTP_PROVIDERS, 
    { provide: XHRBackend, useClass: InMemoryBackendService }, // in-mem server 
    { provide: SEED_DATA, useClass: InMemoryDataService }  // in-mem server data 
]); 

Bu benim package.json geçerli:

{ 
    "name": "angular2-projects", 
    "version": "0.0.0", 
    "license": "MIT", 
    "angular-cli": {}, 
    "scripts": { 
    "start": "ng serve", 
    "postinstall": "typings install", 
    "lint": "tslint \"src/**/*.ts\"", 
    "test": "ng test", 
    "pree2e": "webdriver-manager update", 
    "e2e": "protractor" 
    }, 
    "private": true, 
    "dependencies": { 
    "@angular/common": "2.0.0-rc.4", 
    "@angular/compiler": "2.0.0-rc.4", 
    "@angular/core": "2.0.0-rc.4", 
    "@angular/forms": "0.2.0", 
    "@angular/http": "2.0.0-rc.4", 
    "@angular/platform-browser": "2.0.0-rc.4", 
    "@angular/platform-browser-dynamic": "2.0.0-rc.4", 
    "@angupackage.lar/router": "3.0.0-beta.1", 
    "@angular/router-deprecated": "2.0.0-rc.2", 
    "es6-shim": "0.35.1", 
    "reflect-metadata": "0.1.3", 
    "rxjs": "5.0.0-beta.6", 
    "systemjs": "0.19.26", 
    "zone.js": "0.6.12" 
    }, 
    "devDependencies": { 
    "angular-cli": "1.0.0-beta.9", 
    "codelyzer": "0.0.20", 
    "ember-cli-inject-live-reload": "1.4.0", 
    "jasmine-core": "2.4.1", 
    "jasmine-spec-reporter": "2.5.0", 
    "karma": "0.13.22", 
    "karma-chrome-launcher": "0.2.3", 
    "karma-jasmine": "0.3.8", 
    "protractor": "3.3.0", 
    "ts-node": "0.5.5", 
    "tslint": "3.11.0", 
    "typescript": "1.8.10", 
    "typings": "0.8.1" 
    } 
} 

Ya bu hata gitmesini sağlamak için ne gerekiyor?

import{InMemoryBackendService, SEED_DATA } from 'angular2-in-memory-web-api'

src/system-config.js yılında:

const barrels: string[] = [ 
    // Angular specific barrels. 
    '@angular/core', 
    '@angular/common', 
    '@angular/compiler', 
    '@angular/forms', 
    '@angular/http', 
    '@angular/router', 
    '@angular/platform-browser', 
    '@angular/platform-browser-dynamic', 


    // Thirdparty barrels. 
    'rxjs', 
    'angular2-in-memory-web-api', 

    // App specific barrels. 
    'app', 
    'app/shared', 
    /** @cli-barrel */ 
]; 



    // Apply the CLI SystemJS configuration. 
    System.config({ 
     map: { 
     '@angular': 'vendor/@angular', 
     'rxjs': 'vendor/rxjs', 
     'main': 'main.js', 
     'angular2-in-memory-web-api': 'vendor/angular2-in-memory-web-api' 
     }, 

ve projeler kök dizininde angular-cli-build.js eklemek bu

Answer 1

Önce, main.ts içinde Sonra npm i angular2-in-memory-web-api --save

gerek :

'angular2-in-memory-web-api/**/**/*.js'` 

Son olarak sunucuyu yeniden başlatın ve ng build'u ng serve'dan önce çalıştırın.

Answer 2

Angular2-in-memory-web-api'nin en son sürümleri için yanıt eklediğim için 404 hatası bulmaya çalışırken saatlerce çalışıyorum.

"angular2-in-memory-web-api": "0.0.6", 

: Bütün angular2-bellek-web API arasında

1) İlk şimdi yeni angular-in-memory-web-api için kullanımdan kaldırıldı, bu son sürüme sahip üzere package.json değiştirmek için emin olmak gerekir demektir gibi bir şey değiştirmek gerekir:

"angular-in-memory-web-api": "^0.1.3", 

2)) (systemjs.config.js değiştirmek için if in angular page tutorial for example as my case unutmayın:

'angular-in-memory-web-api': 'node_modules/angular-in-memory-web-api/bundles/in-memory-web-api.umd.js', 

Yeni bildiriye değiştirmek için

import { InMemoryWebApiModule } from 'angular-in-memory-web-api/in-memory-web-api.module'; 

ihtiyaçlarını: Senin modülü ithalatı ise

3) son sürümüne değiştirmek Sonra npm install yeniden

import { InMemoryWebApiModule } from 'angular-in-memory-web-api'; 

4) ve Tha uygulama son sürümü ile çalışmalıdır herhangi bir aksaklık olmadan. Bu problemi bana çözdü. Uygulamayı kaçırdınız:

Answer 3

bellek içi web api için modül yapılandırması, burada öğreticinin bölümüdür: angular-toh-simulating-the-web-api

Answer 4

Eski bir gönderiyi yanıtlama, ancak çözümüm farklıydı, bu yüzden burada yayınlayacağımı düşündüm.

En son paketi kullanarak ve açısal (4 ve üstü) kullanarak aynı hatayı alıyorum.

Neden benim app.module.ts içinde HttpModule önce InMemoryWebApiModule ithal etmişti. InMemoryWebApiModule HttpModule (ve şüphesiz böyle olmalı) sonra hile yaptı.

yanlış -

ithalat: [
BrowserModule,
FormsModule,
InMemoryWebApiModule.forRoot (InMemoryDataService),
HttpModule'ü,
JsonpModule,
]>

doğru -

ithalat: [ BrowserModule, FormsModule, HttpModule'ü, JsonpModule, InMemoryWebApiModule.forRoot (InMemoryDataService) // bu httpModule sonra içe gereken]