在下面我提到了我正在使用lazyLoading Module的代码。 所以请检查我的代码并纠正我。面临TypeError:无法读取Angular 7中未定义的属性“ toLowerCase”。 下面是添加模型类。我想知道我在代码中犯了什么错误,请纠正我。
模型类
export class C_data {
productId:number;
product:string;
code:string;
available:string;
price:number;
rating:number;
productImage:string;
}
allData-page.component.ts
import {C_data} from '../../shared/model/c_data';
import { AllDataService } from './allData.service';
import { Observable } from 'rxjs';
@Component({
selector: 'all-data',
templateUrl: './alldataPage.component.html'
})
export class AlldataPageComponent implements OnInit {
cdata:Observable<C_data[]>;
constructor(private _allDataService: AllDataService) { }
ngOnInit() {
this._allDataService.getData().subscribe(data => this.cdata)
console.log(this.cdata);
}
}
allData.service.ts
import { HttpClient } from '@angular/common/http';
import { C_data } from 'app/shared/model/c_data';
import { Observable } from 'rxjs';
@Injectable({providedIn: 'root'})
export class AllDataService {
urls:'../../shared/services/modeldata.json';
constructor(private _httpClient: HttpClient) { }
getData():Observable<C_data[]>{
return this._httpClient.get<C_data[]>(this.urls);
}
}
modeldata.json
"product":"Leaf Rake",
"code":"GDN-0011",
"available":"Mar 19,2016",
"price":25,
"rating":5,
"productImage":"http://lorempixel.com/400/200/"
},
{
"productId":2,
"product":"Garden Cart",
"code":"GDN-0021",
"available":"April 19,2016",
"price":25,
"rating":4,
"productImage":"http://lorempixel.com/400/200/"
},
{
"productId":3,
"product":"Hammer",
"code":"GDN-0041",
"available":"Mar 19,2016",
"price":25,
"rating":3.5,
"productImage":"http://lorempixel.com/400/200/"
},
{
"productId":4,
"product":"Saw",
"code":"GDN-0011",
"available":"Mar 19,2016",
"price":25,
"rating":4.1,
"productImage":"http://lorempixel.com/400/200/"
},
{
"productId":5,
"product":"Video Game Controller",
"code":"GDN-0025",
"available":"Mar 19,2016",
"price":25,
"rating":4.2,
"productImage":"http://lorempixel.com/400/200/"
}
]
alldata.module.ts
import { AlldataPageComponent } from './allData-page.component';
import { CommonModule } from '@angular/common';
import { AllDataRouterModule } from './allData-routing.module';
import { HttpClientModule } from '@angular/common/http';
@NgModule({
imports: [
CommonModule,
AllDataRouterModule,
HttpClientModule
],
exports: [],
declarations: [AlldataPageComponent]
})
export class AllDataModule { }
allData-routing.module.ts
import { NgModule } from '@angular/core';
import { AlldataPageComponent } from './allData-page.component';
export const routes: Routes = [
{
path:'',
component: AlldataPageComponent,
data:{
title:'data-table'
}
}
]
@NgModule({
imports: [RouterModule.forChild(routes)],
exports: [RouterModule],
declarations: [],
})
export class AllDataRouterModule { }
答案 0 :(得分:2)
应该是:
urls='../../shared/services/modeldata.json';
不是
urls:'../../shared/services/modeldata.json';