角2路由器。导航未定义

Question

我正在尝试使用navigation.route但仍然遇到此错误：TypeError：undefined不是对象（正在评估“ this.router.navigate”）

我似乎无法正常工作，所以我想知道是否有人可以指出我做错了什么。 这是我的组件，是的，我的路线定义为{路径：“配置文件”，组件：配置文件}。 它与RouterLink的正常工作只是不在router.navigate中。 谢谢！

import {Component, ViewEncapsulation} from '@angular/core';
import {DataService} from '../shared/services/DataService';
import {Widget} from '../core/widget/widget';
import {TablesBackgrid} from './tables-backgrid/tables-backgrid';
import {DataTableDirectives} from 'angular2-datatable/datatable';
import {SearchPipe} from './pipes/search-pipe';
declare var jQuery: any;
import {Router,ActivatedRoute} from '@angular/router';
import {IAccounts} from '../shared/interfaces/IAccounts';
import {Profile} from '../profile/profile';
import { ROUTER_DIRECTIVES } from '@angular/router';

const Agents = [];

@Component({
  selector: '[account-list]',
  template: require('./account-list.html'),
  encapsulation: ViewEncapsulation.None,
  directives: [Widget,TablesBackgrid, DataTableDirectives,ROUTER_DIRECTIVES],
  styles: [require('./account-list.scss')],
  pipes: [SearchPipe]
})

export class AccountList {
    agents: any[];
    router:Router;

  constructor(ds:DataService) {
    let test = ds.getAccounts().then(res => {
      this.agents = res.agents;
    });
  }

  loadProfile(id){
    this.router.navigate(['/profile']);
  }

  ngOnInit(): void {
    let searchInput = jQuery('#table-search-input, #search-countries');
    searchInput
      .focus((e) => {
      jQuery(e.target).closest('.input-group').addClass('focus');
    })
      .focusout((e) => {
      jQuery(e.target).closest('.input-group').removeClass('focus');
    });
  }

}

Answer 1

您应该在构造函数中注入Router依赖项。 我想建议的ds.getAccounts()件事是， ds.getAccounts()服务调用应移至组件的ngOnInit生命周期挂钩。

constructor(private ds:DataService, router: Router) {
    this.router = router;
}

ngOnInit(): void {
    let test = this.ds.getAccounts().then(res => {
       this.agents = res.agents;
    });
    //....other code here as is......
}