我的 angular CLI生成的应用程序在dev
环境中正常运行,但当我通过生成应用程序切换到prod
环境时:
ng build -prod
我得到以下异常:
Template parse errors: Can't bind to 'routerLink' since it isn't a known native property
我怀疑缩小/破坏有什么问题......
有人可以帮忙吗?我的ng CLI版本是 1.0.0-beta.10 。
编辑1 :这是我的main.ts
:
import {bootstrap} from "@angular/platform-browser-dynamic";
import {enableProdMode} from "@angular/core";
import {Title} from "@angular/platform-browser";
import {provideRouter} from "@angular/router";
import {LocationStrategy, HashLocationStrategy} from "@angular/common";
import {HTTP_PROVIDERS, Http, RequestOptions} from "@angular/http";
import {
TRANSLATE_PROVIDERS,
TranslateService,
TranslateLoader,
TranslateStaticLoader
} from "ng2-translate/ng2-translate";
import {AppComponent} from "./app/app.component";
import {SessionService} from "./app/session/session.service";
import {UserAccountService} from "./app/useraccount/useraccount.service";
import {ApplicationRequestOptions} from "./app/session/session.utils";
import {StylingService} from "./app/shared/services/styling.service";
import {AppRoutes} from "./app/routes/app.routes";
import {environment} from "./app/environment";
import {FormBuilder, REACTIVE_FORM_DIRECTIVES, provideForms, disableDeprecatedForms} from "@angular/forms";
import {PasswordValidationService} from "./app/shared/services/password-validation.service";
import {validatePassword} from "./app/shared/validators/password.validator";
if (environment.production) {
enableProdMode();
}
bootstrap(AppComponent, [
provideRouter(AppRoutes),
HTTP_PROVIDERS,
TRANSLATE_PROVIDERS,
Title,
FormBuilder,
REACTIVE_FORM_DIRECTIVES,
SessionService,
UserAccountService,
StylingService,
TranslateService,
PasswordValidationService,
disableDeprecatedForms(),
provideForms(),
{provide: RequestOptions, useClass: ApplicationRequestOptions},
{provide: LocationStrategy, useClass: HashLocationStrategy},
{
provide: TranslateLoader,
useFactory: (http:Http) => new TranslateStaticLoader(http, 'assets/i18n', '.json'), deps: [Http]
}
]);
和我的app.component.ts
:
import {Title} from "@angular/platform-browser";
import {Component, OnInit} from "@angular/core";
import {ROUTER_DIRECTIVES, ActivatedRoute} from "@angular/router";
import {TranslateService} from "ng2-translate/ng2-translate";
import {NavbarComponent} from "./shared/components/navbar.component";
import {FooterComponent} from "./shared/components/footer.component";
import {SigninComponent} from "./session/session.signin.component";
import {HomeComponent} from "./home/components/home.component";
import {SessionService} from "./session/session.service";
import "moment/locale/fr";
import * as moment from "moment";
@Component({
selector: 'app',
template: `
<section class="container-fluid row Conteneur">
<navbar></navbar>
<section class="container">
<router-outlet (onActivate)="setTitle($event)"></router-outlet>
</section>
</section>
<section class="container-fluid">
<footer></footer>
</section>
`,
directives: [NavbarComponent, FooterComponent, SigninComponent, HomeComponent, ROUTER_DIRECTIVES]
})
export class AppComponent implements OnInit {
constructor(private translate:TranslateService,
private sessionService:SessionService,
private titleService:Title,
private activatedRoute:ActivatedRoute) {
let userLang = 'fr';
translate.use(userLang);
moment.locale(userLang);
}
ngOnInit() {
this.sessionService.reloadPersonalInfo();
}
setTitle($event) {
this.translate.get(this.activatedRoute.snapshot.data['titleKey'])
.subscribe(translation=>this.titleService.setTitle(translation));
}
}
这是我的家庭组件模板:
<div>
<a [routerLink]="['/signin']">signin</a>
</div>
和班级:
import {Component} from '@angular/core';
import {ROUTER_DIRECTIVES} from '@angular/router';
@Component({
moduleId: module.id,
templateUrl: 'home.component.html',
directives: [ROUTER_DIRECTIVES]
})
export class HomeComponent {
}