javascript - 角度错误 TS2339 试图从烧瓶服务器访问/检索数据
问题描述
我正在尝试从烧瓶数据库中提取数据并将其呈现在 Angular 上。在 item/item.component.ts 中出现错误并出现错误 TS2339:“ItemComponent”类型上不存在属性“itemdata”
访问烧瓶端点按预期显示数据数组,所以我认为这与问题无关。
在 itemdata.service.ts
...
@Injectable({
providedIn: 'root'
})
export class ItemdataService {
constructor(private http: HttpClient) { }
private API_URL = 'http://localhost:5000/item';
getItem(): Observable<Item[]>{
return this.http.get<Item[]>(this.API_URL);
}
}
在 item.component.ts
...
import {Item} from '../item';
import {ItemdataService} from '../itemdata.service';
...
export class ItemComponent implements OnInit {
item: Item[];
constructor() { }
getItem(): void{
this.itemdata.getItem().subscribe(item=>this.item = item);
}
ngOnInit() {
}
}
预期成功编译并成功检索数据以用于显示。
编辑:现在使用构造函数(私有 itemdata:ItemdataService)
但是数据未显示在模板中。
数据
[{"id": 1, "name": "First item"}, {"id": 2, "name": "Second item"}, {"id": 3, "name": "Third item"}]
item.component.html
<p>item list</p>
<ul>
<li *ngFor = "let x of item">
<span>{{x.name}}</span>
</li>
</ul>
<p>end of item list</p>
数据未显示在页面上。相反,仅显示基本页面和“项目列表的项目列表末尾”。
解决方案
constructor(private itemdata: ItemdataService)
推荐阅读
- discord.py - discord.ext.commands.errors.CommandInvokeError 命令引发异常:NameError: name 'self' is not defined
- flutter - Flutter - 忽略拇指向下
- react-native-mapbox-gl - MapboxGL.SymbolLayer 过滤表达式以检查数组中的 id
- javascript - Django LeafletWidget 自定义几何样式
- python - 基于输入数据的 TensorFlow 持续训练
- python - 如何在 Django ORM 中使用 prefetch_related 表计数进行过滤?
- java - 我需要什么集合来存储对象及其数量?
- html - 尝试使用 CSS flex 制作方形图像墙,但第一行的行为不如预期
- c++ - SDL 音频回调不产生声音
- python - 使用 Python 在 TCP 端口上进行 T24 Telnet 连接