I am trying to use InMemoryDbService as data source in Angular 14.0.2 (/Node 16.15.1) project. I'm getting "api/[something]" not found in the browser log, no other apparent error. I can't share the whole code but I'll try to replicate the relevant parts here.
app.module.ts
(...)
import { HttpClientInMemoryWebApiModule } from 'angular-in-memory-web-api';
import { InMemoryDataService } from './in-memory-data.service';
(...)
imports: [
(...)
HttpClientModule,
HttpClientInMemoryWebApiModule.forRoot(InMemoryDataService, {dataEncapsulation:false}),
ThingsModule,
AppRoutingModule
(...)
in-memory-data.service.ts
import { Injectable } from '@angular/core';
import { InMemoryDbService } from 'angular-in-memory-web-api';
import { MockThings } from './thing/mock-thing-list';
import { Thing} from './thing/thing';
@Injectable({
providedIn: 'root'
})
export class InMemoryDataService implements InMemoryDbService {
createDb() {
const Things: Thing[] = MockThings;
return { Things};
}
}
thing.service.ts
import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { catchError, Observable, of, tap } from 'rxjs';
import { Things} from './thing';
@Injectable()
export class ThingService {
constructor(private http: HttpClient) { }
getThingsList(): Observable<Thing[]> {
return this.http.get<Thing[]>('api/things').pipe(
tap((response) => this.log(response)),
catchError((error) => this.handleError(error, []))
);
}
private log(response: Thing[] | Thing| undefined) {
console.table(response);
}
private handleError(error: Error, errorValue: any) {
console.error(error);
return of(errorValue);
}
(...)
}
thing-list.component.ts
(...)
@Component({
selector: 'app-thing-list',
templateUrl: './thing-list.component.html',
})
export class ThingListComponent implements OnInit {
Things: Thing[];
selectedThing: Thing|undefined;
constructor(private router: Router, private thingService: ThingService ) {
}
ngOnInit(): void {
this.ThingService .getThingList().subscribe(thingList => this.Things);
}
(...)
}
