【发布时间】:2017-12-02 00:46:04
【问题描述】:
我有模特Url:
export class Url {
author: String;
description: String;
list_tags: [{
name: String
}];
count_click: Number;
full_url: String;
short_url: String;
date: String;
time: String;
}
从服务器端,我通过info-url.component.ts 中的 id 获取有关 url 的数据:
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { Url } from '../shared/models/url.model';
import { UrlService } from '../shared/services/url.service';
@Component({
selector: 'app-info-url',
templateUrl: 'info-url.component.html',
styleUrls: ['info-url.component.scss']
})
export class InfoUrlComponent implements OnInit {
url: Url;
edit: boolean = false;
constructor(
private urlService: UrlService,
private route: ActivatedRoute) {}
ngOnInit() {
let id = this.route.snapshot.params['id'];
this.urlService.getUrlById(id).subscribe(
data => {
this.url = data.url;
this.edit = data.edit;
}
)
}
}
得到了我在info-url.component.html中输出的数据:
<div class="container">
<h1>Little info about url</h1>
<div class="url">
<p>Full url: {{url.full_url}}</p>
<p>Shortener-url: {{url.short_url}}</p>
<div class="description">
<h3>Little description:</h3>
<p>{{url.description}}</p>
</div>
<div class="tags">
<div *ngFor="let tag of url.list_tags">
<a>{{tag.name}}</a>
</div>
</div>
<div class="count">
<p>{{url.count_click}}</p>
</div>
<div class="date-time">
<p>Date: {{url.date}}</p>
<p>Url: {{url.time}}</p>
</div>
<div class="user">
<p>Created by: <a>{{url.author}}</a></p>
</div>
<div *ngIf="edit">
<button class="btn btn-success">Edit</button>
</div>
</div>
</div>
在控制台输出下一个错误:
ERROR TypeError: Cannot read property 'list_tags' of undefined
at Object.View_InfoUrlComponent_0._co [as updateDirectives] (InfoUrlComponent.html:11)
at Object.debugUpdateDirectives [as updateDirectives] (core.es5.js:13106)
at checkAndUpdateView (core.es5.js:12288)
at callViewAction (core.es5.js:12651)
at execComponentViewsAction (core.es5.js:12583)
at checkAndUpdateView (core.es5.js:12294)
at callViewAction (core.es5.js:12651)
at execEmbeddedViewsAction (core.es5.js:12609)
at checkAndUpdateView (core.es5.js:12289)
at callViewAction (core.es5.js:12651)
需要查看 *ngFor 指令执行的第 11 行。
我不明白为什么模板中有错误。 请帮帮我。
【问题讨论】:
-
可能是,但我认为将来我的问题和答案也会对任何人有所帮助。如果你不同意我想知道你的原因
-
请问,您的评论是针对我的 Alexey 吗?如果是这样,我不确定你的意思是什么?
-
我的评论是针对你的。我想说我不同意你的第一篇文章。附:对不起,我的英语水平,因为我开始了。
-
您完全有权发表您的意见。我们只是在这里避免发布重复的问题,如果它们是重复的,我们应该将它们标记为重复。 SO上有很多相同的问题,所以我建议你在发布问题之前进行彻底的搜索。如果你只是用谷歌搜索你的标题,你会发现很多问题,这里还有几个:stackoverflow.com/questions/42268832/… 和 stackoverflow.com/questions/41242793/… 都有相同的问题:)
-
我同意你的意见。打扰一下。我认为以后我不会再在stackoverflow中重复问题了。