Javascript Angular4 Heroes示例的e2e测试实现

这是我的密码：

describe('my-app Heroes', () => {
  let page: MyAppPage;
  beforeEach(() => {
    page = new MyAppPage();
  });

  it('should display dashboard page', () => {
   page.navigateTo();
   expect(page.getCurrentUrl()).toContain("dashboard");
 });

 .
 .// code 
 .
  // want to click first heroes for detail information
  it("click on first hero",()=>{
     element(by.css('my-dashboard a:nth-child(1)')).click();
     expect(page.getCurrentUrl()).toContain("detail");

   });

});

错误：

1) my-app Heroes click first hero
  - Failed: unknown error: Element <a _ngcontent-c0="" ng-reflect-router-link="/detail/12"  href="/detail/12">...</a> is not clickable at point (8, 167). Other element would receive the click: <nav>...</nav>
    (Session info: chrome=57.0.2987.98)
    (Driver info: chromedriver=2.29.461571 (8a88bbe0775e2a23afda0ceaf2ef7ee74e822cc5),platform=Linux 4.4.0-62-generic x86_64)

1）我的应用程序英雄单击第一个英雄
-失败：未知错误：元素在点（8167）处不可单击。其他元素将收到单击：。。。
（会话信息：chrome=57.0.2987.98）
（驱动程序信息：chromedriver=2.29.461571（8a88bbe0775e2a23afda0ceaf2ef7ee74e822cc5），平台=Linux 4.4.0-62-generic x8664）

我已经观察到，静态锚的点击事件工作得很好，但动态锚的点击事件得到了这个错误