Не удается найти модуль './in-memory-data-service' в туре по героям для Angular2

Просто убедитесь, что все ваши базы покрыты

В вашем package.json должен совпадать с тем, который указан в этом страница.

"angular-in-memory-web-api": "~0.1.1",

// Imports for loading & configuring the in-memory web api
import { InMemoryWebApiModule } from 'angular-in-memory-web-api';
import { InMemoryDataService }  from './in-memory-data-service'; // <-- Make sure this matches the file name

ng generate service InMemoryData --module=app

Создадим src/app/in-memory-data.service.ts файл. Затем добавьте код, указанный в руководстве, и он будет работать. AFAIK они даже не подразумевают этого в учебнике, так что не расстраивайтесь. На самом деле они говорят

Метод конфигурации forRoot () принимает класс InMemoryDataService, который загружает базу данных в памяти.

В примере Tour of Heroes создается такой класс src / app / in-memory-data.service.ts

Это тарабарщина и неверно.

Мои проекты созданы с использованием текущих инструментов CLI, и я установил это:

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

Меня устраивает.

Для учебника Angular5 и [email protected]:

Добавьте новый файл in-memory-data.service.ts в корневой каталог со следующим содержимым:

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

export class InMemoryDataService  implements InMemoryDbService {
createDb() {
    let heroes = [
        { id: 1, name: 'Windstorm' },
        { id: 2, name: 'Bombasto' },
        { id: 3, name: 'Magneta' },
        { id: 4, name: 'Tornado' }
    ];
    return { heroes };
}
}

В туре по героям (пример урока по Angular) после

import { HttpClientInMemoryWebApiModule } from 'angular-in-memory-web-api';
import { InMemoryDataService } from './in-memory-data-service';

вы должны выполнить команду:

ng generate service InMemoryData

Чтобы решить эту проблему, я сделал

ng generate service InMemoryData --module=app  

как предложено пользователем user875234

Но также многие ответы здесь были скопированы и вставлены из вопроса

import { InMemoryDataService } from './in-memory-data-service';  

Что неверно. Все должно быть так, как показано в руководстве по героям.

import { InMemoryDataService } from './in-memory-data.service';  

Обратите внимание на «dataDOTservice», а не на дефис. Нам, новичкам, это кажется ошибкой в ​​руководстве и не соответствует вопросу OP или некоторым ответам здесь. Точка правильная, дефис неправильный.

Я получил эту ошибку в 2020 году. Я запускал сервер и выполнял команды ng в другом терминале.

Перезагрузка сервера сделала свое дело. (CTRL + C, нг подавать)

Те из вас, кто просматривает старые статьи, могут попробовать это решение, повторно запустив приложение с помощью ng serve.

ng generate service InMemoryData --module = app было предыдущим решением; однако вы получите эту ошибку:

Неизвестный вариант: '--module'

По умолчанию Angular устанавливает свойство providedIn внутри декоратора @Injectable. Это позаботится о регистрации службы, и, следовательно, --module больше не является практическим решением.

Чтобы перезапустить приложение angular, вы можете запустить в интерфейсе командной строки ... taskkill / IM node.exe / F

затем ng serve

Сделайте глобальную установку, используйте sudo, если у вас есть проблемы с разрешениями

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

Angular 6 - Windows у меня

Failed to compile.

./src/app/in-memory-data.service
Module build failed: Error: ENOENT: no such file or directory, open 'e:\visualStudioWorkspace\angular-tour-of-heroes\src\app\in-memory-data.service'

Когда я меняю

import { InMemoryDataService }  from './in-memory-data.service';

to (обратите внимание на изменения data.service в data-service)

import { InMemoryDataService }  from './in-memory-data-service';

и переименуйте файл в in-memory-data-service.ts, он работает.

чтобы решить эту проблему, попробуйте этот шаг

1. запустите ng generate service InMemoryData --module=app со своим angular cli, затем замените код, указанный в руководстве, и сохраните его.
2. перейдите к app.module.ts и добавьте в него код, так что код такой.

app.module.ts

import { HttpClientModule }    from '@angular/common/http';
import { HttpClientInMemoryWebApiModule } from 'angular-in-memory-web-api';
import { InMemoryDataService }  from './in-memory-data.service';

@NgModule({
declarations: [
   ...
],
imports: [
   ...
   HttpClientModule,
   // The HttpClientInMemoryWebApiModule module intercepts HTTP requests
   // and returns simulated server responses.
   // Remove it when a real server is ready to receive requests.
   HttpClientInMemoryWebApiModule.forRoot(
      InMemoryDataService, { dataEncapsulation: false }
   )
],
providers: [],
   ...

3. Не забудьте добавить private heroesUrl = 'api/heroes'; // URL to web api в hero.service.ts

hero.service.ts

   ...
export class HeroService {

   constructor(
      private http: HttpClient,
      private messageService: MessageService,
   ) { }

   private heroesUrl = 'api/heroes';  // URL to web api

   /** GET heroes from the server */
   getHeroes (): Observable<Hero[]> {
      return this.http.get<Hero[]>(this.heroesUrl)
   }


   getHero(id: number): Observable<Hero> {
   ...

   /** Log a HeroService message with the MessageService */
   private log(message: string) {
   ...

4. Обновите приложение, запустив ng sever, и наслаждайтесь !.

Я решил эту проблему, выполнив следующую команду:

$ yarn add angular-in-memory-web-api

Запустите это, если вы используете npm:

$ npm i angular-in-memory-web-api

Та же проблема. Я исправляю это, останавливая ng serve, запускаю ng build и снова ng serve.