Question

我有一个带有带有href的html标记的组件。我希望该href的值来自于我已经实现的，我已订阅的角度服务，但是href值没有通过。我认为这是一个计时问题-页面在订阅返回之前呈现。我该如何补救？

<a href="{{links?.someLink1}}"> Click it </a>

然后在我的提示中，我有类似的内容：

    this.myService.getLinks().subscribe(linkList => {
      this.links = linkList;
console.dir(this.links); //this returns the json object so i know it is there
       });

如果我这样写html：

<a href="{{links.someLink1}}"> Click it </a>

我收到有关尝试读取未定义属性'someLink1'的错误。

更新

我认为这与我对Typescript缺乏了解有关。在我的话中，我想声明

links: any;

但是当我这样做时，我的模板无法解析link.someLink1 如果我将ts声明更改为links ={}; 那么它将起作用。但是我不明白为什么？

Answer 1

此语法不正确<a href={{links?.someLink1}} Click it </a>

因为缺少> 和“

使用

<a href="{{links?.someLink1}}"> Click it </a>

或

<a [attr.href]="links?.someLink1"> Click it </a>

还请记录数据，以检查其URL是否有效？

Answer 2

如果您的问题是未更新html绑定，则应尝试使用异步管道，顺便说一句，您必须在href后面加上“”，这样结果将是：

<a href="{{links?.someLink1 | async}}" Click it </a>

角度订阅没有等待足够长的时间

2 个答案: