Question

我的Angular Universal应用程序仅在模板中呈现HTML，而不是从API请求加载的任何变量或数据。

我创建了一个非常简单的测试组件：

HTML：

<h1>ObjectID: #{{user?.id}}</h1>

打字稿：

export class TestComponent implements OnInit {

  user: User
  constructor(private userService: UserService) { }

  ngOnInit() {
    this.userService.getUser(1).subscribe(user => this.user = user)
  }
}

如果我查看我的网页来源，结果将是<h1>ObjectID: #</h1>。我正在使用Universal Starter。 Angular Universal服务器是否假设等待ngOnInit()完成加载？

Answer 1

问题是我从两个独立的Docker容器中提供我的Angular应用程序和我的API应用程序，并且服务器端呈现的NodeJS应用程序试图对API容器的公共URL进行HTTP调用 - 这个问题是Docker容器不知道其他容器的公共URL（例如0.0.0.0:8000），它只知道容器名称（例如http://backend）。

这只是开发过程中的一个问题，而不是在生产过程中，因为它使用的是真正的公共域。

我所做的解决方案是在我的本地计算机上的etc/hosts文件中添加一个别名为0.0.0.0，然后在我的docker-compose.yml文件中添加相同的别名。因此，我的浏览器和容器都可以访问自定义主机名上的API。

本地计算机上的etc / hosts

0.0.0.0 api.local

<强>搬运工-compose.yml

services:
  ...
  backend:
    ...
    networks:
      default:
        aliases:
          - "api.local"

从客户端和服务器端渲染应用程序开发过程中的所有HTTP调用都是http://api.local/

Angular Universal不会从API请求中呈现数据

1 个答案: