当我想用以下程序包版本在AOT中编译我当前的项目时,我会遇到问题:
- @ngtools/webpack@6.0.3
- @angular@latest (6.0.2)
- Webpack@4.0.0
my webpack and tsconfig.json configuration can be find here
我遇到了一些与模板上使用的private
/protected
范围相关的问题,还有一些提取参数给了一些并不真正需要它的函数(例如,不在EventBinding上使用的$Event).
现在我有以下列表,我找不到哪里是我的问题所在:
/路径/收件人/应用程序/标题/主标题/主标题.组成部分html(85,7)::指令TableOfContentComponent,应为0个参数,但得到1个.
我的main-header.component.html
文件包含:
// main-header.component.ts
@ViewChildren('headerItems') public headerItems: QueryList<HeaderItemAbstract>;
mainMenuStates = {
hamburger: false,
bookmarks: false,
search: false,
toc: false,
medias: false,
article: false,
language: false
};
我的TableOfContentComponent
不包含任何@Input
属性.
@Component({
selector: 'playui-table-of-content-template',
templateUrl: './table-of-content.component.html',
animations: [slideUpAndDownAnimation]
})
export class TableOfContentComponent extends HeaderItemAbstract implements OnInit {
toc: TableOfContentModel[];
devices: DevicesModel;
tocContentHeight: number;
tocContentMargin: number;
menuHeight: string;
constructor(private tableOfContentService: TableOfContentService,
private deviceService: DeviceService,
private elemRef: ElementRef) {
super();
this.toc = this.tableOfContentService.tableOfContent;
}
}
/路径/目的地/应用程序/标题/主标题/汉堡菜单/汉堡菜单.组成部分html(125,5)::指令SliderComponent,应为0个参数,但得到1个.
我的hamburger-menu.component.html
接近上面给出的代码:
<ps-slider-component [template]="slidable" [countItems]="associatedDocuments.length">
<ng-template #slidable>
<ul class="clearfix">
<li class="ps-hmt-associated-item-wrapper pull-left slider-item"
*ngFor="let document of associatedDocuments">
<a href="{{ document.link }}" target="_blank" class="btn-nostyle">
<div class="ps-hmt-image">
<img src="{{ document.images.thumbnail }}" alt="">
</div>
<p class="ps-hmt-title slider-text"
[matTooltip]="isArticleView ? null : document.title"
[matTooltipPosition]="'above'"
[matTooltipClass]="['ps-mat-tooltip', 'ps-mat-tooltip-doc']"
>
{{ document.title }}
</p>
</a>
</li>
</ul>
</ng-template>
</ps-slider-component>
// On ts side
associatedDocuments: Array<AssociatedDocumentModel>;
@ViewChild('slidable') slidable: ElementRef;
我的SliderComponent
看起来像:
export class SliderComponent extends UnsubscribeHelper implements OnInit, OnChanges {
@Input() template: ElementRef;
@Input() countItems: number;
@Input() resetSlide ?: null;
@Input() fixedHeight?: null;
@Input() isVariableWidth?: null;
@Input() isBookmarks?: null;
@Input() hasSkeleton?: boolean = false;
/路径/收件人/应用程序/标题/主标题/媒体/对话框/图像对话框.组成部分html(34,5)::指令CarouselComponent,应为0个参数,但得到1个.
真的很接近上一次,我想问题是一样的.
/路径/收件人/应用程序/文档/页面/页面.组成部分html(7,9)::指令InfinityPageScrollComponent,应为0个参数,但得到1个.
这里我们没有任何关于InfinityPageScrollComponent
的输入,标签是这样的<ps-infinity-page-scroll></ps-infinity-page-scroll>
我知道,当我在我的网页上禁用AOT时,一切都像魅力一样工作.
我试着在AoT Do's and Don'ts上找到解决办法,但没有任何结果.
我还注意到,如果禁用fullTemplateTypeCheck
,我将面临大约18000个错误,其中包含一些隐式的any类型,以及在构造函数上声明的服务的更奇怪、未定义的属性.
-EDIT 1:提供抽象类代码:UnsubscribeHelper
export abstract class HeaderItemAbstract extends UnsubscribeHelper implements AfterViewInit {
public toggleItem: string = 'out';
public ANIMATION_DURATION = slideUpAndDownAnimationDuration;
constructor() {
super();
}
// [Some other method]
/**
* Self animate after loading on DOM
*/
ngAfterViewInit()
{
// Wait next to to avoid error :
// ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked
setTimeout(() => {
this.toggleAnimation();
},100);
}
}
抽象类UnsubscribeHelper
的代码:
export abstract class UnsubscribeHelper implements OnDestroy {
subscriptions: Subscription[] = [];
ngOnDestroy() {
this.subscriptions.forEach(sub => sub.unsubscribe());
}
addSubscription(subscription: Subscription) {
this.subscriptions.push(subscription);
}
}