Question

我的MongoDB中有很多数据，并且我正在为应用程序使用MEAN堆栈。所以我有一个搜索，用户可以在数据库中搜索条目，让我们以一家医院为例。用户可以指定医院的选项，然后系统会显示符合条件的医院。因此，如果用户现在单击一家医院，他们将获得该医院的全部详细信息。额外的页面/组件上的开放时间，停车位等。

因此，我现在想为此特定医院创建一个唯一的链接，以便用户可以将其保存在他们想要的任何位置，并在下次使用时访问它而无需使用搜索。

我想要这样的东西-> http://mywebsite.com/hospital/california/alameda-hospital

我该如何解决？我的组件基于@Input()，通常保存医院信息。因此，现在，当用户输入URL时，我需要请求数据库，获取所需的信息，并将其填充到我的对象hospitalDetails: Object中，否则正确的方法是什么？

Answer 1

使用ngOnInit中的route参数，并订阅更改，更新组件值：

constructor( private hospitalService: HospitalService, private route: ActivatedRoute ) // lets say you get the hospital info from the hospitalService via a get
ngOnInit(){
  this.route.params.subscribe(params => {
      this.hospitalId = params.hospitalId
      this.hospitalService.getHospital(this.hospitalId).subscribe( hospital => {
       this.hospital = hospital
      }
  }
}

在定义路由的路由器中：

{ path: "hospital/:state/:hospitalId", component: HospitalDetailsComponent }

这定义了可以在route.params订阅中访问的参数。

我只是将HospitalId用作通用标识符，但是您可以结合州和医院名称来完成同一件事。

编辑：您仍然可以在医院详细信息中使用@Input装饰器。该组件既可以用作模板组件（使用@input），也可以用作路由器出口替换（路由器直接指向该组件）。完全相同的代码在两种情况下都可以使用。我一直使用这种模式。

Answer 2

我更喜欢打字稿中的常量以“保持简单”。

Answer 3

您可以通过url的路径名来实现它。每次用户进入特定医院时，您都可以通过组件的ts文件获取url并从数据库中找到其信息，如下所示：

    var url = window.location.pathname;
    var filename = url.substring(url.lastIndexOf('/')+1);
    alert(filename);

这将为您提供帮助，而无需一次加载所有数据库

为Angular 6中的数据库中的每个条目生成唯一的URL

3 个答案: