Question

我有一堆li元素，当用户点击它们时，它会打开不同组件中这些元素的更详细视图。

但是，它需要两次点击才能显示我想要显示的数据。

当用户点击 ONCE 时，组件会以空视图模板打开。

当用户点击再次时，会显示已填充的数据。

我是否可以将其放在一个锚定标签中，将我的详细视图和一起发送给我？

有更好的方法或更好的方法吗？

<ul>
  <li *ngFor="let favorite of sortedFavorites; let i= index">
    <a class= 'clickMe' (click)= "openContact($event, i)" routerLink= "/details">
    <div *ngIf= "favorite.isFavorite">
        <img class="smallImage" onerror="this.onerror=null;this.src='User Icon Small.png';"
             src={{favorite.smallImageURL}} />
        <h3><img src="Favorite — True.png">{{ favorite.name }}</h3>
        <br>
        <p>{{ favorite.companyName }}</p>
        <hr>
    </div>
   </a>
  </li>
</ul>

编辑：有些人建议我在填充数据之前使用reslove guards来获取数据，但我只是从本地JSON文件中提取数据并将其传递给我的组件。

Answer 1

你使用点击事件。通过编程器使用路由器

导航到详细信息页面

 this.router.navigate(['path']);

在openContact（）中执行的任何进程，然后在详细信息页面上重定向。

添加到构造函数private router: Router

是否可以在同一个锚标签上安装routerLink和click事件？

1 个答案: