0

我正在 StackBlitz 上编写样板 Angular 应用程序，并且在初始加载时出现错误，但是当我在编辑器中进行任何更改时，应用程序加载正常。

/turbo_modules/@angular/compiler@6.0.7/bundles/compiler.umd.js 中的错误 (301:17) 无法解析 MainComponent 的所有参数：(?)。评估 main.ts 启动应用程序

该应用程序在这里。主要组件，似乎是这样扔的，我没有看到任何丢失的参数（我认为这不比略读更有价值，只是粘贴以供参考）：

import { Component } from '@angular/core'
import { Router } from '@angular/router';

@Component({
  selector: 'main-component',
  template: `
    <ul>

      <li>
        <a [ngClass] = "{ active: (activeLink === 'Home') }" 
           (click) = "goHome()">
          HOME
        </a>
      </li>

      <li>
        <a [ngClass] = "{ active: (activeLink === 'News') }"
           (click) = "goToNews()">
          NEWS
        </a>
      </li>

    </ul>
    <br>
    <router-outlet></router-outlet>
  `,
  styleUrls:  ['main.component.css']
})

export class MainComponent{

  constructor(private router: Router) {}

  public activeLink = 'Home'; //default

  public goToNews() {
    this.activeLink = 'News';
    this.router.navigate(['/news']);
  }

  public goHome() {
    this.activeLink = 'Home'; 
    this.router.navigate(['/home']);
  }

}

是什么导致了错误，我该如何解决？

编辑：看起来更改主要组件代码（例如添加空格等）会导致应用程序暂时“修复自身” - 可能是 StackBlitz 问题。

4

2 回答 2

1

路由映射在 app-routing.module.ts 中已经提到，所以不需要在 MainComponent 的构造函数中注入 Router，应该去掉。您可以找到工作示例：https ://stackblitz.com/edit/angular-route-resolves-start-fpuzaq

于 2018-07-10T10:01:40.887 回答
0

看起来我所做的并没有完全错误 - 角度应用程序只是没有在 StackBlitz 上正确清除自己，为此，它需要main.ts文件中的以下代码：

import './polyfills';

import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

import { AppModule } from './app/app.module';

platformBrowserDynamic().bootstrapModule(AppModule).then(ref => {
  // Ensure Angular destroys itself on hot reloads.
  if (window['ngRef']) {
    window['ngRef'].destroy();
  }
  window['ngRef'] = ref;

  // Otherise, log the boot error
}).catch(err => console.error(err));
于 2018-07-11T23:46:58.227 回答