无法读取未定义的属性"符号"和"id"

Question

我正在开发一个带有net 5和angular 11的API。在我的项目中，我有一个StockTransaction表，它包括Stock表中的stockid作为外键。我正在努力实现这一点，当我按下BuyStock按钮时，我会购买特定的股票。我确实能够做到这一点，但我在控制台中收到消息-无法读取未定义的属性"symbol"one_answers"id"。基本上，我尝试应用与标准网络应用程序相同的逻辑，它正在运行，但控制台是个问题。这是我的代码，请让我知道我是否应该再放一些代码，我不想这是一个长问题。提前感谢！

库存服务

buyStock() {
return this.http.post(`${this.baseUrlTup}/${this.formData.stockId}`, this.formData);
}

添加库存组件.ts

@Component({
selector: 'app-add-stock',
templateUrl: './add-stock.component.html',
styleUrls: ['./add-stock.component.scss']
})
export class AddStockComponent implements OnInit {
stock: IStock;

constructor(public stocksService: StocksService,
private activatedRoute: ActivatedRoute,
private bcService: BreadcrumbService,
private transactionService: TransactionsService,
private router: Router) { }
ngOnInit(): void {
this.loadStock();
this.stocksService.formData.stockId = this.stock.id;
}
onSubmit(form: NgForm) {
this.stocksService.formData.stockId = this.stock.id;
this.buyingStock(form);
}
loadStock() {
return 
this.stocksService.getStock(+this.activatedRoute.snapshot.paramMap.get('id')).subscribe(response => 
{
this.stock = response;
this.bcService.set('@stockDetails', this.stock.companyName);
}, error => {
console.log(error);
});
}
buyingStock(form: NgForm) {
this.stocksService.buyStock().subscribe(
response => {
this.resetForm(form);
this.router.navigateByUrl('myportfolio');
}, error => {
console.log(error);
}
);
}
resetForm(form: NgForm) {
form.form.reset();
this.transactionService.formData = new IStTransaction();
}
}

添加stock.component.html

<div class="d-flex justify-content-center mt-3 mb-3">
<div class="col-5">

<form novalidate autocomplete="off" #form="ngForm" 
(submit)="onSubmit(form)">    
<div class="form-group">
<label>Stock</label>
<input class="form-control form-control-lg" placeholder=" 
{{stock.symbol}}">
</div>
<div class="form-group">
<label>Price</label>
<input class="form-control form-control-lg" placeholder="Price" 
name="price"
#price="ngModel" [(ngModel)]="stocksService.formData.price">
</div>
<div class="form-group">
<label>Quantity</label>
<input class="form-control form-control-lg" 
placeholder="Quantity" name="quantity"
#quantity="ngModel" 
[(ngModel)]="stocksService.formData.quantity">
</div>
<!--  <div class="form-group">
<label>Resolved</label>
<input class="form-control form-control-lg" 
placeholder="Resolved" name="resolved"
#resolved="ngModel" 
[(ngModel)]="stocksService.formData.resolved">
</div> -->
<div class="meki form-group">
<button class="zeki btn btn-info btn-lg btn-block mt-3" 
type="submit">SUBMIT</button>
</div>

</form>
</div>
</div>

Answer 1

我认为您的问题是在数据从响应到达之前使用stock及其成员。尝试使用可选的链接。

示例：

<input class="form-control form-control-lg" placeholder="{{stock?.symbol}}">