我有关于routerLinkActive的列表:
<div *ngFor="let experimentType of experimentTypeList">
<a class="d-flex align-items-center experiemnt-link-button selectable-item"
[routerLink]="getScenarioExperimentTypeLink(experimentType)"
routerLinkActive="link-button-selected">
{{ experimentType.name }}
</a>
</div>
当其中一个链接被激活时,我想将其滚动到视图中(通过scrollIntoView())。
我可以手动执行此操作:
<div (click)="scroll()">scroll()</div>
public scroll(): void {
this.elementRef.nativeElement.querySelector('.link-button-selected').scrollIntoView()
}
但是我不知道如何以编程方式进行操作。
我尝试过:
没有任何效果。它在指令添加类之前被触发。
答案 0 :(得分:0)
在您的html中,您可以执行以下操作(我添加了*/foo/
):
#somethingToTarget
在您的组件代码中:
<a class="d-flex align-items-center experiemnt-link-button selectable-item"
#somethingToTarget
[routerLink]="getScenarioExperimentTypeLink(experimentType)"
routerLinkActive="link-button-selected">
{{ experimentType.name }}
</a>
然后您可以致电:
@ViewChild('somethingToTarget') somethingToTarget: ElementRef;