Angular2 Tutorial (Tour of Heroes): ไม่พบโมดูล 'angular2-in-memory-web-api'


99

ฉันทำตามบทช่วยสอนแล้ว หลังจากเปลี่ยนapp/maint.tsในบท Http ฉันได้รับข้อผิดพลาดเมื่อเริ่มแอปผ่านบรรทัดคำสั่ง:

app / main.ts (5,51): ข้อผิดพลาด TS2307: ไม่พบโมดูล 'angular2-in-memory-web-api'

(Visual Studio Code ทำให้ฉันมีข้อผิดพลาดเดียวกันภายใน main.ts - ขีดเส้นใต้หยักสีแดง)

นี่คือsystemjs.config.js:

/**
 * System configuration for Angular 2 samples
 * Adjust as necessary for your application needs.
 */
(function(global) {
  // map tells the System loader where to look for things
  var map = {
    'app':                        'app', // 'dist',
    '@angular':                   'node_modules/@angular',
    'angular2-in-memory-web-api': 'node_modules/angular2-in-memory-web-api',
    'rxjs':                       'node_modules/rxjs'
  };
  // packages tells the System loader how to load when no filename and/or no extension
  var packages = {
    'app':                        { main: 'main.js',  defaultExtension: 'js' },
    'rxjs':                       { defaultExtension: 'js' },
    'angular2-in-memory-web-api': { defaultExtension: 'js' },
  };
  var ngPackageNames = [
    'common',
    'compiler',
    'core',
    'http',
    'platform-browser',
    'platform-browser-dynamic',
    'router',
    'router-deprecated',
    'upgrade',
  ];
  // Add package entries for angular packages
  ngPackageNames.forEach(function(pkgName) {
    packages['@angular/'+pkgName] = { main: pkgName + '.umd.js', defaultExtension: 'js' };
  });
  var config = {
    map: map,
    packages: packages
  }
  System.config(config);
})(this);

นี่คือapp/main.ts:

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

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

// The usual bootstrapping imports
import { bootstrap }      from '@angular/platform-browser-dynamic';
import { HTTP_PROVIDERS } from '@angular/http';

import { AppComponent }   from './app.component';

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

คำตอบ:


66

สำหรับฉันทางออกเดียวคือการอัปเกรดangular2-in-memory-web-apiเป็น0.0.10.

ในpackage.jsonชุด

'angular2-in-memory-web-api': '0.0.10'

ในบล็อกการพึ่งพาและในsystemjs.config.jsชุด

'angular2-in-memory-web-api': { main: 'index.js', defaultExtension: 'js' }

ในpackagesวัตถุ


4
ที่แก้ไขข้อผิดพลาดของโมดูล หลังจากนั้นฉันได้รับข้อผิดพลาด 404 - ฉันต้องการระบุ'angular2-in-memory-web-api': { main: 'index.js', defaultExtension: 'js' }ในไฟล์ systemjs.config.js (ดูคำตอบโดย @GrantTaylor)
toni

4
โปรดทราบว่าหากคุณใช้ angular-cli เพื่อพัฒนาแอปพลิเคชันของคุณคุณต้องเพิ่มลง'angular2-in-memory-web-api/**/*.+(js|js.map)'ในvendorNpmFilesอาร์เรย์ในไฟล์ angular-cli-build.js Aftewards 'angular2-in-memory-web-api': 'vendor/angular2-in-memory-web-api'คุณต้องชี้แผนที่ระบบปรับแต่งของคุณต้องการเพื่อ: จากนั้นรันใหม่ng serve(หรือnpm start) เพื่อให้ไฟล์ angular2-in-memory-web-api จบลงในโฟลเดอร์ dist / vendor
ofShard

4
หากคุณกำลังใช้ปลั๊กอินเชิงมุม 2 คราสบรรทัดต่อไปนี้ไปใน package.json ในส่วน:dependencies "angular-in-memory-web-api": "0.1.1"ฉันต้องเรียกใช้npm installจากโฟลเดอร์โครงการในภายหลังแม้ว่า
João Mendes

1
ฉันยังคงประสบปัญหานี้ :( แม้ว่าจะทำตามขั้นตอนที่จำเป็นแล้วก็ตาม
Hassan Tariq

5
ฉันไม่มีไฟล์ systemjs.config.js เลยในโปรเจ็กต์ของฉัน ฉันใช้ Angular4 แม้ว่า
bleistift2

101

สำหรับโครงการที่สร้างโดยใช้เครื่องมือ CLI ปัจจุบันมันทำงานให้ฉันโดยการติดตั้ง

npm install angular-in-memory-web-api --save

จากนั้นดำเนินการนำเข้าเป็น

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

package.json ของฉัน

> "dependencies": {
>     "@angular/common": "^2.4.0",
>     "@angular/compiler": "^2.4.0",
>     "@angular/core": "^2.4.0",
>     "@angular/forms": "^2.4.0",
>     "@angular/http": "^2.4.0",
>     "@angular/platform-browser": "^2.4.0",
>     "@angular/platform-browser-dynamic": "^2.4.0",
>     "@angular/router": "^3.4.0",
>     "angular-in-memory-web-api": "^0.3.1",
>     "core-js": "^2.4.1",
>     "rxjs": "^5.1.0",
>     "zone.js": "^0.7.6"   },

>     "devDependencies": {
>     "@angular/cli": "1.0.0-rc.4",
>     "@angular/compiler-cli": "^2.4.0",
>     "@types/jasmine": "2.5.38",
>     "@types/node": "~6.0.60",
>     "codelyzer": "~2.0.0",
>     "jasmine-core": "~2.5.2",
>     "jasmine-spec-reporter": "~3.2.0",
>     "karma": "~1.4.1",
>     "karma-chrome-launcher": "~2.0.0",
>     "karma-cli": "~1.0.1",
>     "karma-jasmine": "~1.1.0",
>     "karma-jasmine-html-reporter": "^0.2.2",
>     "karma-coverage-istanbul-reporter": "^0.2.0",
>     "protractor": "~5.1.0",
>     "ts-node": "~2.0.0",
>     "tslint": "~4.5.0",
>     "typescript": "~2.0.0"   }

1
ขอบคุณเช่นกันฉันต้องนำเข้า InMemoryDbService เป็น: นำเข้า {InMemoryDbService} จาก 'angular-in-memory-web-api / in-memory-backend.service';
Baris Atamer

4
หลังจากเรียกใช้npm installคำสั่งฉันได้เวอร์ชัน 0.3.2 ด้วยเวอร์ชันนั้นฉันทำได้import { InMemoryWebApiModule } from 'angular-in-memory-web-api';ตามที่อธิบายไว้ในทัวร์ชม
comecme

ดังที่ @comecme ชี้ให้เห็นว่าหลังจากทำงานnpm installได้import { InMemoryWebApiModule } from 'angular-in-memory-web-api'ผล
ajay_whiz

21

นี่คือสิ่งที่ใช้ได้ผลสำหรับฉัน:

ฉันสังเกตเห็นว่า package.json มีเวอร์ชันต่อไปนี้:

"เชิงมุม2 -in-memory-web-api": "0.0.20"

สังเกต " 2 " ในชื่อ

อย่างไรก็ตามเมื่ออ้างถึง InMemoryWebApiModule มันใช้ 'angular-in-memory-web-api' โดยไม่มี 2 ในชื่อ ดังนั้นฉันจึงเพิ่มมันและแก้ไขปัญหาได้:

นำเข้า {InMemoryWebApiModule} จาก 'angular2-in-memory-web-api';

หมายเหตุ : ฉันพบสิ่งนี้ในส่วนประกาศของhttps://github.com/angular/in-memory-web-api

ตั้งแต่ v.0.1.0 แพ็คเกจ npm ถูกเปลี่ยนชื่อจาก angular2-in-memory-web-api เป็นชื่อปัจจุบันคือ angular-in-memory-web-api ทุกเวอร์ชันหลังจาก 0.0.21 จะถูกจัดส่งภายใต้ชื่อนี้ อย่าลืมอัปเดตคำสั่ง package.json และนำเข้า


18

การเปลี่ยนแปลงเชิงมุม 4

ณ วันที่ 17 ตุลาคม 2017 บทช่วยสอนไม่ได้กล่าวถึงซึ่งangular-in-memory-web-apiไม่รวมอยู่ในโครงสร้าง CLI มาตรฐานและต้องติดตั้งแยกต่างหาก สามารถทำได้อย่างง่ายดายด้วยnpm:

$ npm install angular-in-memory-web-api --save

การดำเนินการนี้จะจัดการการเปลี่ยนแปลงที่จำเป็นโดยอัตโนมัติpackage.jsonดังนั้นคุณจึงไม่จำเป็นต้องแก้ไขเอง

จุดที่สับสน

เธรดนี้ค่อนข้างสับสนเนื่องจาก Angular CLI มีการเปลี่ยนแปลงอย่างมากนับตั้งแต่เธรดนี้เริ่มต้นขึ้น ปัญหาเกี่ยวกับ API ที่พัฒนาอย่างรวดเร็วจำนวนมาก

  • angular-in-memory-web-apiถูกเปลี่ยนชื่อ; มันลด2จากเชิงมุม2เป็นเพียงangular
  • Angular CLI ไม่ใช้ SystemJS อีกต่อไป (แทนที่ด้วย Webpack) ดังนั้นจึงsystemjs.config.jsไม่มีอยู่อีกต่อไป
  • npm's package.jsonไม่ควรที่จะแก้ไขได้โดยตรง; ใช้ CLI

สารละลาย

ในเดือนตุลาคม 2017 การแก้ไขที่ดีที่สุดคือการติดตั้งด้วยตัวเองโดยใช้npmดังที่ฉันได้กล่าวไว้ข้างต้น:

$ npm install angular-in-memory-web-api --save

ขอให้โชคดี!


นอกจากนี้คุณอาจต้องอัปเดตไฟล์ package.json ด้วย zone.js เป็น 0.8.4 จากนั้นเรียกใช้การอัปเดต npm จากนั้นลองติดตั้งด้านบน
Jason

1
กำลังประสบปัญหาใหม่ที่นี่ไม่พบโมดูล "./in-memory-data.service"
Kannan T

@kannan - 1. ติดตั้งangular-in-memory-web-apiกับnpm? 2. มีรายการสำหรับangular-in-memory-web-apiในของคุณpackage.jsonหรือไม่? 3. ลองฆ่าและรีสตาร์ท Angular CLI: Ctrl+Cเพื่อฆ่า; ng serveเพื่อเริ่มต้นใหม่) บางครั้ง CLI ก็ทำหน้าที่แปลก ๆ (Ditto สำหรับปลั๊กอิน Angular สำหรับ VSCode)
Master of Ducks

@MasterofDucks Bro แก้ไขเมื่อวานนี้ปัญหาคือฉันไม่ได้สร้างไฟล์นั่นคือสาเหตุ ขอบคุณสำหรับความช่วยเหลือ :)
Kannan T

15

มันใช้ได้กับฉัน:

ในชุดบล็อกการพึ่งพา package.json (ใช้ "เชิงมุม" แทน "angular2")

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

จากนั้นเรียกใช้

 npm install

หรือ

เพียงแค่เรียกใช้ (ฉันชอบ)

npm install angular-in-memory-web-api --save

14

ฉันกำลังทำแบบฝึกหัดและมีปัญหาคล้ายกัน สิ่งที่ดูเหมือนว่าจะได้รับการแก้ไขสำหรับฉันคือการกำหนดไฟล์หลักสำหรับ'angular2-in-memory-web-api'ในpackagesตัวแปรในsystemjs.config.js:

'angular2-in-memory-web-api': { main: 'index.js', defaultExtension: 'js' },

ก่อนที่ฉันจะเพิ่มสิ่งนี้มีข้อผิดพลาด 404 บันทึกไว้/node_modules/angular2-in-memory-web-api/ซึ่งดูเหมือนว่ากำลังพยายามโหลดไฟล์ JavaScript ตอนนี้มันโหลด/node_modules/angular2-in-memory-web-api/index.jsและไฟล์อื่น ๆ ในโมดูลนี้


2
ขณะนี้มีข้อผิดพลาดหลายประการกับส่วน HTTP ของบทช่วยสอน Tour of Heroes
Grant Taylor

สิ่งนี้ไม่ช่วยแก้ไขข้อผิดพลาดของฉัน (พร้อมกับข้อผิดพลาดที่เป็นปัญหา)
toni

ก่อนอื่นฉันต้องอัปเดต´angular2-in-memory-web-api´ (ดูคำตอบโดย @traneHead) จากนั้นจึงใช้คำตอบนี้
toni

ขอบคุณแก้ไขปัญหาของฉัน ฉันไม่จำเป็นต้องกระแทกถึง 0.0.10 ตามที่คนอื่นอธิบาย
Rathk Skokan

10

สิ่งนี้ช่วยแก้ปัญหา 404 ได้

จาก Angular in-memory-web-api Documentation

นำเข้า InMemoryWebApiModule หลัง HttpModule ทุกครั้งเพื่อให้แน่ใจว่าผู้ให้บริการ XHRBackend ของ InMemoryWebApiModule แทนที่ตัวอื่นทั้งหมด

การนำเข้าโมดูลควรมี InMemoryWebApiModule อยู่หลัง HttpModule

@NgModule({
imports:      [ BrowserModule,
              AppRoutingModule,
              FormsModule,
              HttpModule,
              InMemoryWebApiModule.forRoot(InMemoryDataService),
              ...

1
สิ่งสำคัญคือต้องมาหลังจากนำเข้าเส้นทางเช่น AppRoutingModule ในการสาธิต Angular2 ฉันมี AppRoutingModule หลังจาก InMemoryWebApiModule.forRoot (InMemoryDataService) และมันทำลายทุกอย่าง
ทำเครื่องหมาย

6

จากโฟลเดอร์รูทของคุณ (โฟลเดอร์มี package.json) โดยใช้:

npm install angular-in-memory-web-api –-save

ได้ผลสำหรับฉันโดยใช้คู่มือเริ่มใช้งานฉบับย่อใหม่กับ Angular-cli
OST

@OST Dude แม้ว่าฉันจะใช้ angular-cli แต่ฉันพบข้อผิดพลาดนี้ไม่พบโมดูล "./in-memory-data.service"
คาน T

5

ทางออกที่ง่ายที่สุดที่ฉันคิดได้คือติดตั้งแพ็คเกจด้วย npm แล้วรีสตาร์ทเซิร์ฟเวอร์:

npm install angular-in-memory-web-api --save

ฉันเกือบจะติดตั้งแพ็คเกจ angular2-in-memory-web-apiแล้ว แต่หน้า npm แจ้งว่า:

ทุกรุ่นหลังจาก 0.0.21 จะ (หรือเร็ว ๆ นี้จะ) ส่งภายใต้ มุมในหน่วยความจำบนเว็บ API

หมายเหตุ : โซลูชันนี้ใช้ได้กับโปรเจ็กต์ที่สร้างขึ้นด้วยเครื่องมือ CLI ซึ่งไม่แสดงรายการแพ็กเกจเป็นการพึ่งพาและอาจไม่สามารถแก้ปัญหาสำหรับโปรเจ็กต์ที่สร้างด้วย Quickstart seed ซึ่งจะแสดงรายการแพ็กเกจเป็นการอ้างอิง .


ปัญหาของฉันng serveคือยังคงทำงานอยู่ในขณะที่กำลังติดตั้ง ต้องปิดและรีสตาร์ท
Jorn.Beyers

4

ฉันใช้เชิงมุม 4 และด้านล่างเพื่อแก้ปัญหาของฉัน

npm ติดตั้ง angular-in-memory-web-api --save


สวัสดีแม้ฉันกำลังใช้ angular 4 ฉันได้ทำตามที่คุณพูดแล้ว แต่กำลังประสบปัญหาใหม่ที่นี่ไม่พบโมดูล './in-memory-data.service'
Kannan T

3

นี่มันเหม็นจริงๆ ขอบคุณ @traneHead, @toni และคนอื่น ๆ ขั้นตอนเหล่านี้ได้ผลสำหรับฉัน

  1. อัปเกรดangular2-in-memory-web-apiเป็น0.0.10
  2. แก้ไขคุณสมบัติตัวแปรแพ็คเกจในsystemjs.config.js:

angular2-in-memory-web-api': { main: 'core.js', defaultExtension: 'js' }


วิดีโอนี้อาจมีประโยชน์เช่นกัน: Angular2 Tutorial - HTTP
AnderSon

3

ฉันสร้างโครงการของฉันโดยใช้ angular-cli และฉันตั้งค่าใน package.json "angular-in-memory-web-api": "^ 0.2.4" ในบล็อกการพึ่งพาจากนั้นฉันเรียกใช้การติดตั้ง npm

ทำงานให้ฉัน: D


คำแนะนำใด ๆ เกี่ยวกับสิ่งที่ทำให้เกิดปัญหานี้ หรือสิ่งที่พวกเขาสามารถกำหนดค่าที่สามารถตรวจสอบหรือเปลี่ยนแปลงเพื่อขจัดปัญหา บางทีเนื้อหาใน "package.json" ของคุณอาจช่วยได้
Joshua Briefman

3

สำหรับผู้ใช้ที่สร้างโปรเจ็กต์ว่างด้วย angular cli 1.4.9 (เกิดขึ้นจริงในเดือนตุลาคม 2017) จากนั้นเริ่มทำตามคำแนะนำทีละขั้นตอนเพียงแค่รันคำสั่งต่อไปนี้:

npm i angular-in-memory-web-api

เพียงแค่คำสั่งนั้นโดยไม่มีอะไรเพิ่มเติม

หวังว่าจะช่วยประหยัดเวลาของใครบางคน


2

หากคุณใช้ angular cli คุณจะได้รับข้อผิดพลาดนี้

โปรดเพิ่ม'angular2-in-memory-web-api'ในconst barrelsไฟล์ system-config.ts ด้านล่าง:

 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 */
];

และเพิ่ม'angular2-in-memory-web-api': 'vendor/angular2-in-memory-web-api'ตามด้านล่าง.

System.config({
  map: {
    '@angular': 'vendor/@angular',
    'rxjs': 'vendor/rxjs',
    'main': 'main.js',
    'angular2-in-memory-web-api': 'vendor/angular2-in-memory-web-api'
  },
  packages: cliSystemConfigPackages,

});

สร้างใหม่โดยใช้npm start. สิ่งนี้ช่วยแก้ปัญหาให้ฉันได้


0

ลองเพิ่มคำจำกัดความ typescript:

sudo typings install --save file:./node_modules/angular2-in-memory-web-api/in-memory-backend.service.d.ts

... ระบุชื่ออ้างอิง:

angular2-in-memory-web-api

จากนั้นเพิ่มจุดเข้าสำหรับ "angular2-in-memory-web-api" ใน/systemjs.config.js

var packages = {
  ...
  'angular2-in-memory-web-api': { main: 'core.js', defaultExtension: 'js' }
};

ฉันติดตั้งการพิมพ์เหมือนที่คุณเขียน ที่เปลี่ยนเนื้อหาของโฟลเดอร์การพิมพ์ (เพิ่ม "\ definitions \ in-memory-backend.service \ index.d.ts" ให้กับเบราว์เซอร์และโฟลเดอร์ย่อยหลักและเพิ่มการอ้างอิงในไฟล์ browser.d.ts และ main.d.ts ). คุณ "ระบุชื่ออ้างอิง" หมายความว่าอย่างไร?. ฉันเพิ่มจุดเข้าตามที่คุณระบุ แต่ข้อผิดพลาดของฉันยังคงมีอยู่
toni

เมื่อคุณเรียกใช้ "sudo typings install ... " การพิมพ์ควรถามคุณว่า "ชื่ออ้างอิงคืออะไร" จากนั้นคุณสามารถป้อน "angular2-in-memory-web-api"
user1014932

คำตอบของฉันใช้กับ angular2-in-memory-web-api v0.0.7 btw
user1014932

0

ฉันมีปัญหาเดียวกันฉันเปลี่ยนใน systemjs.config:

'angular2-in-memory-web-api': { defaultExtension: 'js' },

ตามบรรทัดนี้:

'angular2-in-memory-web-api': { main: 'core.js', defaultExtension: 'js' },

0

การเปลี่ยนสายตามที่แนะนำไว้ข้างต้นได้ผลสำหรับฉันในบทช่วยสอน Angular 2 Heroes:

'angular2-in-memory-web-api': { main: 'core.js', defaultExtension: 'js' },

0

ฉันแก้ไขการคัดลอกindex.jsและindex.d.tsไปที่core.jsและcore.d.tsนั่นคือภายในnode_modules/angular2-in-memory-web-apiโฟลเดอร์ ไปคิดออก


0

คำตอบหลักช่วยฉัน: เปลี่ยน

'angular2-in-memory-web-api': { defaultExtension: 'js' },

ถึง

'angular2-in-memory-web-api': { main: 'index.js', defaultExtension: 'js' }

0

ใน app \ main.ts เพียงแค่แก้ไข:

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

ถึง:

import { InMemoryBackendService, SEED_DATA } from '../node_modules/angular2-in-memory-web-api';

จากนั้นเพิ่มพารามิเตอร์ index.js ใน

var packages = {
    'app': { main: 'main.js', defaultExtension: 'js' },
    'rxjs': { defaultExtension: 'js' },
    'angular2-in-memory-web-api': { main:'index.js', defaultExtension: 'js' }
};

ใน systemjs.config.js

มันได้ผลสำหรับฉัน


0

การแก้ไขล่าสุด ณ วันที่นี้คือถึง

  1. แทนที่อินสแตนซ์ทั้งหมดของ "angular2-in-memory-web-api" ด้วย "angular-in-memory-web-api"
  2. เปลี่ยนเวอร์ชันการพึ่งพา package.json จาก"angular-in-memory-web-api": "0.0.20"เป็น"angular-in-memory-web-api": "0.1.0" และ"zone.js": "^0.6.23"เป็น"zone.js": "^0.6.25"
  3. ใน systemjs.config.js เปลี่ยนเส้นทางสำหรับ index.js ควรมีลักษณะดังนี้:
    'angular-in-memory-web-api': { main: 'index.js', defaultExtension: 'js' }

0

ล่าสุด (ปัจจุบัน 0.1.14) นี่คือสิ่งที่ระบุไว้ในไฟล์ CHANGELOG

ในsystemjs.config.jsคุณควรเปลี่ยนการแมปเป็น:

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

จากนั้นลบจากpackages:

'angular-in-memory-web-api': {        
   main: './index.js',     
   defaultExtension: 'js'      
}

0

ฉันได้รับข้อผิดพลาดนี้เนื่องจากฉันกำลังนำเข้าInMemoryWebApiModuleจากangular2-in-memory-web-apiฉันลบ 2 จริงๆแล้วฉันมีสองรายการในไฟล์ package.json ของฉัน หนึ่งและที่สองคือangular2-in-memory-web-api angular-in-memory-web-apiการใช้angular-in-memory-web-apiช่วยแก้ปัญหาให้ฉันได้ ดังนั้นการนำเข้าของคุณควรเป็นดังนี้:

import { InMemoryWebApiModule } from 'angular-in-memory-web-api';
...
@NgModule({

imports: [
InMemoryWebApiModule.forRoot(InMemoryDataService)
]
})

การใช้ cli-angular คุณไม่จำเป็นต้องเปลี่ยนแปลงอะไรsystem.config.jsเลย


0

สำหรับฉันการติดตั้งจากไดเร็กทอรี angular-tour-of-heroes ก็ใช้ได้สำหรับฉัน

C: \ nodejs \ angular-tour-of-heroes> npm ติดตั้ง angular-in-memory-web-api --save



0

ฉันพบปัญหาที่คล้ายกัน ฉันเพิ่งดาวน์โหลดตัวอย่างทั้งหมดในตอนท้ายของส่วนที่ 7 (ส่วนสุดท้าย) ของบทช่วยสอนและเรียกใช้ มันได้ผล

แน่นอนคุณต้องติดตั้งและรวบรวมทุกอย่างก่อน

> npm install
> npm start

ฉันยังเปลี่ยน 'app-root' เป็น 'my-app' ใน app.component.ts


0

หากใช้ angular cli เพื่อสร้างแอพ angular2 ของคุณรวมทั้ง angular2-in-memory-web-api จะเกี่ยวข้องกับสามขั้นตอน:

  1. เพิ่ม api ไปยังไฟล์ system-config.ts (ภายในไดเร็กทอรีย่อย src) ดังต่อไปนี้:

    /** Map relative paths to URLs. */
    const map: any = {
      'angular2-in-memory-web-api': 'vendor/angular2-in-memory-web-api'
    };
    /** User packages configuration. */
    const packages: any = {
      'angular2-in-memory-web-api': { main: 'index.js', defaultExtension: 'js' }
    };
    
  2. เพิ่ม

    angular2-in-memory-web-api/**/*.+(js|js.map)' 
    

ไปยังอาร์เรย์ vendorNpmFiles ในไฟล์ angular-cli-build.js เช่น ofShard ที่กล่าวถึง

  1. แน่นอนเพิ่มลงใน package.json ตามที่อธิบายไว้โดย traneHead; สำหรับ 2.0.0-rc.3 ฉันใช้เวอร์ชันด้านล่าง:

    "angular2-in-memory-web-api": "0.0.13"
    

ฉันพบลิงก์นี้"การเพิ่มวัสดุ 2 ในโปรเจ็กต์ของคุณ" อธิบายขั้นตอนการเพิ่มไลบรารีของบุคคลที่สามอย่างชัดเจน


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

InMemoryDataServiceชั้นไม่ได้มาภายใต้ API ใด ๆ เราจำเป็นต้องสร้างคลาสบริการจากนั้นนำเข้าคลาสบริการนั้นลงในไฟล์ app.module.ts


โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.