Angular 2在同一组件的不同实例中导航，显示不同的数据

I have a simple side menu in my Angular 2 applications which display a list of classRoom, each class Room has many users.

我的Angular 2应用程序中有一个简单的侧面菜单，它显示了一个classRoom列表，每个类都有很多用户。

I navigate between the different instance with routerLink.

我使用routerLink在不同的实例之间导航。

My problem is that when I click on the first item : -class Room number 1 I have no problem and the list of user are alright, but when I click on Class Room number 2 the data does not change, so the users displayed are the users of Class Room Number 2.

我的问题是，当我点击第一项时： - 类房间号1我没有问题，用户列表没问题，但是当我点击Class Room 2时数据没有改变，所以显示的用户是Class Room Number的用户。

How can I tell Angular To re-render the component with the new data?
Any suggestions?

如何告诉Angular使用新数据重新渲染组件？有什么建议么？

UPDATE CODE EXAMPLE

更新代码示例

side-menu.component.html

侧menu.component.html

<li *ngFor='let classRoom of classRooms'>
    <li>
        <a [routerLink]="['/app/users/', classRoom.name]">**Users**</a>
    </li>
    <li>....</li>
    <li>....</li>
</li>

routes.ts

routes.ts

....
{ path: 'app/users/:classroom', component: usersComponent},

So when i click on 'users' link, i call the users component, get classroom's name by route param and make a get request to get the users.

因此，当我点击“用户”链接时，我会调用用户组件，通过路由参数获取教室名称并发出获取请求以获取用户。

With the first class room no problem, but if i click on the 'users'link of the second classroom no change happend.

一流的房间没有问题，但如果我点击第二个教室的'用户'链接没有变化发生。

2 个解决方案

#1

I see you are loading userComponent in your route.ts. Can you try like below:

我看到你在route.ts中加载userComponent。你能尝试如下：

<div class="col-md-3" *ng-for="let classRoom of classRooms">
    <a [routerLink]="['/app/users/', classRoom.name]">
       <user-component></user-component>
    </a>
</div>

#2

Your routerLink needs a terminal route

您的routerLink需要终端路由

[routerLink]="['parent', 'child', query.id]"

to understand it more clear, see this post see my question and answer

更清楚地了解它，看到这篇文章看到我的问题和答案

#1