Angular routerLink不会触发ngOnInit [重复]

问题描述 投票:1回答:3

这个问题在这里已有答案:

这是component.ts文件中的ngOnInit

ngOnInit() {
      this.locationService.getLocation().subscribe( locations => {
      this.locations = locations;
    });
  }
<a [routerLink]="['/locations-list']">

当我使用[routerLink]导航到上面的组件时,它会导航到组件并加载视图,但它不会触发上面的ngOnInit方法。但是,如果我刷新页面,它工作正常。 针对上述问题是否有任何解决办法?

我已经使用href导航到页面,并使用href上面的方法工作正常,但它非常慢。这就是我将href改为[routerLink]的原因。

这是包含视图的component.html

                <div class="table-responsive">
                  <table class="table">
                    <thead class=" text-primary">
                      <th>
                        Location Name
                      </th>

                    </thead>
                    <tbody *ngIf="locations?.length > 0">
                      <tr *ngFor="let location of locations">
                        <td *ngIf="location.verified != false">
                          {{location.locationName}}
                        </td>
                      </tr>
                    </tbody>
                  </table>
                </div>
              </div>
angular typescript angular-routerlink
3个回答
1
投票

当路由器参数更改时,基本路由保持不变。所以它不会触发ngOnInit。所以订阅路线事件

ngOnInit() {
     this.route.params.subscribe(
     params => { 
            // your code
     });
  }

1
投票

ngOnInit()仅在实例化组件后调用一次,但在路径更改时不调用。您可以注入路由器并订阅它的事件或参数以获得有关路由更改的通知。

ngOnInit() {
     this.route.params.subscribe(params: any) => {
       if(params) //your code
    });
}

1
投票

试试这个

// on click call this function
    (click)="HyperLink()"
// on ts file 
    HyperLink(){
       window.open('/locations-list');  
   }
© www.soinside.com 2019 - 2024. All rights reserved.