typescript Angular 4:Build to prod:属性是私有的,只能在类中访问
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/45321295/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Angular 4 : Build to prod: Property is private and only accessible within class
提问by firasKoubaa
i'm using Angular 4 , i'm running : ng build --prod
我正在使用 Angular 4,我正在运行: ng build --prod
i'm catching this :
我抓住了这个:
ng build --prod
Your global Angular CLI version (1.2.2) is greater than your local
version (1.0.0). The local Angular CLI version is used.
To disable this warning use "ng set --global warnings.versionMismatch=false".
Hash: 7fce5d10c4c3ac9745e8
Time: 68351ms
chunk {0} polyfills.7790a64cc25c48ae62ea.bundle.js (polyfills) 177 kB {4} [initial] [rendered]
chunk {1} main.f10680210e9e45ed33cc.bundle.js (main) 382 kB {3} [initial] [rendered]
chunk {2} styles.d2e6408caea42ccabf99.bundle.css (styles) 175 bytes {4} [initial] [rendered]
chunk {3} vendor.fc69ec31f7ef40b5fffb.bundle.js (vendor) 5.9 MB [initial] [rendered]
chunk {4} inline.91747411075ce6c7f438.bundle.js (inline) 0 bytes [entry] [rendered]
ERROR in ng:///D:/Sources/DotNet/NextGCClientWeb/src/app/login/login.component.html (11,3): Property 'activatedRoute' is private and only accessible within class 'Login
Component'.
ERROR in ng:///D:/Sources/DotNet/NextGCClientWeb/src/app/login/login.component.html (11,3): Property 'activatedRoute' is private and only accessible within class 'Login
Component'.
this error seems to be strange :
这个错误似乎很奇怪:
ERROR in
ng:///D:/Sources/DotNet/NextGCClientWeb/src/app/login/login.component.html (11,3): Property 'activatedRoute' is private and only accessible within class 'Login Component
The indicated component in the error is the follwoing :
错误中指示的组件如下:
import { Component } from '@angular/core';
import { Router, ActivatedRoute, Params } from '@angular/router';
import { Http, Response } from '@angular/http';
import { SessionService } from './../../shared/service';
import { User } from './../../model';
@Component({
selector: 'login',
templateUrl: './login.component.html',
styleUrls: ['./login.component.css']
})
export class LoginComponent {
error: string;
email: string;
password: string;
stayConnected: Boolean;
constructor (
private sessionService: SessionService,
private router: Router,
private activatedRoute: ActivatedRoute
) {
if (activatedRoute.snapshot.params['keyWording']) {
this.sessionService.logInWithFinalization(activatedRoute.snapshot.params['keyWording']);
}
}
logIn() {
this.sessionService.logIn(this.email, this.password, this.stayConnected).subscribe(
() => {
if (this.sessionService.pageRequestedInUnauthenticated == null) {
this.router.navigate(['/welcome']);
} else {
this.router.navigate([this.sessionService.pageRequestedInUnauthenticated]);
}
},
(error: Response) => this.error = error.json()
);
}
}
The html view:
html视图:
<div id="divLogin">
<h1>Se connecter</h1><br>
<i class="fa fa-envelope-o fa-lg" id="iconEmail"></i>
<input type="text" id="email" [(ngModel)]="email" (keyup.enter)="logIn()" class="form-control" placeholder="Adresse email" autofocus />
<i class="fa fa-lock fa-lg" id="iconPassword"></i>
<input type="password" id="password" [(ngModel)]="password" (keyup.enter)="logIn()" class="form-control" placeholder="Mot de passe" />
<button (click)="logIn()" class="btn btn-primary btn-block btn-lg">Connexion</button>
<span id="containerStayConnected" title="Non implémenté"><input type="checkbox" id="stayConnected" [(ngModel)]="stayConnected" /><label for="stayConnected">Restez connecté</label></span>
<a id="forgetPassword" title="Non implémenté">Mot de passe oublié</a><br><br><br>
<a routerLink="/inscription">S'inscrire</a><br>
{{ error }}
</div>
<div class="confirmationMessage" *ngIf="activatedRoute.snapshot.params['keyWording'] == 'validateInscription'"><br>Un lien de confirmation vous a été envoyé sur votre bo?te email afin de valider votre compte. Merci.</div>
<div id="piedDePage"></div>
when running ng serveam not catching it .
运行ng serve时没有抓住它。
Any propositions ??
有什么建议??
回答by brijmcq
Changing to public activatedRoute
更改为公共激活路由
You need to make your activatedRoute public
. Here's a checklist when building for production with aot. ( Taken from this github project https://github.com/asadsahi/AspNetCoreSpa, though it is applicable to any other angular project.)
你需要让你的 activateRoute public
。这是使用 aot 构建生产时的清单。(取自这个 github 项目https://github.com/asadsahi/AspNetCoreSpa,尽管它适用于任何其他 angular 项目。)
AOT - Ahead of time compilation DON'TS
AOT - 提前编译不要
- Don't use require statements for your templates or styles, use styleUrls and templateUrls, the angular2-template-loader plugin will change it to require at build time.
Don't use default exports.
Don't use form.controls.controlName, use form.get(‘controlName')
Don't use control.errors?.someError, use control.hasError(‘someError')
Don't use functions in your providers, routes or declarations, export a function and then reference that function name Inputs, Outputs, View or Content Child(ren), Hostbindings, and any field you use from the template or annotate for Angular should be public
- 不要对模板或样式使用 require 语句,使用 styleUrls 和 templateUrls,angular2-template-loader 插件会在构建时将其更改为 require。
不要使用默认导出。
不要使用 form.controls.controlName,使用 form.get('controlName')
不要使用 control.errors?.someError,使用 control.hasError('someError')
不要在您的提供者、路由或声明中使用函数,导出函数然后引用该函数名称 Inputs、Outputs、View 或 Content Child(ren)、Hostbindings,以及您从模板中使用或为 Angular 注释的任何字段上市
Keeping activatedRoute private
保持激活的路由私有
To keep your activatedRoute private, you can do something like this
为了保持你的激活路由私有,你可以做这样的事情
theData:any;
constructor (
private sessionService: SessionService,
private router: Router,
private activatedRoute: ActivatedRoute
) {
this.activatedRoute.params.subscribe(
params => {
this.theData= params['keyWorking'];
//you will bind the theData instead of the activatedROute
}
);
}
}
}
and in your template
并在您的模板中
<div class="confirmationMessage" *ngIf="theData == 'validateInscription'">
<br>Un lien de confirmation vous a été envoyé sur votre bo?te email afin de
valider votre compte. Merci.</div>
回答by Henry Zhang
Please find more detail in Property is private and only accessible within class
请在Property is private 中找到更多详细信息,并且只能在课堂内访问
Original "error" reported is not an error, but normal restriction of AOT at least for versions 2, 4, 5. The variable used in the template needs to be declared as "public". Template is treated as a separate Typescript class.
原来报的“error”不是错误,而是AOT的正常限制,至少对于2、4、5版本,模板中使用的变量需要声明为“public”。模板被视为一个单独的 Typescript 类。
You can change all the components variable from private to public. If they are used into your template.
您可以将所有组件变量从私有更改为公共。如果它们用于您的模板。
Or you can use ng build -prod --aot=false for building
或者您可以使用 ng build -prod --aot=false 进行构建
回答by SIddharth Pradhan
try with " ng build -env=prod " command. It worked for me to solve this error.
尝试使用“ ng build -env=prod ”命令。它对我来说解决了这个错误。
回答by Chrillewoodz
You're trying to access activatedRoute
which you've injected into your constructor
as a private
variable. Meaning that you won't be able to access it from your template when using AOT.
您正在尝试访问activatedRoute
您constructor
作为private
变量注入的内容。这意味着在使用 AOT 时您将无法从模板访问它。
Either change it to public activatedRoute
or don't use it at all from the template to resolve this issue.
将其更改为public activatedRoute
或根本不使用模板中的它来解决此问题。