I made an application with a webpack seed but now that I want to compile in aot for prod I got a UserError.Error and don't know how to fix it
This happens after angular compil during webpack building.
This the error :
Starting compilation using the angular compiler. Angular compilation done, starting webpack bundling. Error: Error at D:/Projets/sites/brick_reader_front/compiled/src/app/set/set.component.ngfactory.ts:2848:52: Supplied parameters do not match any signature of call target. at UserError.Error (native) at new UserError (D:\Projets\sites\brick_reader_front\node_modules\tools\@angular\tsc-wrapped\src\tsc.ts:33:25) at check (D:\Projets\sites\brick_reader_front\node_modules\tools\@angular\tsc-wrapped\src\tsc.ts:69:11) at Tsc.typeCheck (D:\Projets\sites\brick_reader_front\node_modules\tools\@angular\tsc-wrapped\src\tsc.ts:152:5) at D:\Projets\sites\brick_reader_front\node_modules\tools\@angular\tsc-wrapped\src\main.ts:68:11 at process._tickCallback (internal/process/next_tick.js:103:7)
If anything needed to help me fix it, just let me know
Thanks !
Edit:
this is html:
<div class="app-content">
<h2 fxFlex fxLayoutAlign="center">{{'SET_DETAIL' | translate}}</h2>
<div class="btn" fxFlex fxLayoutAlign="center">
<button class="btn-back" md-raised-button (click)="goBack()">{{'BACK' | translate}}</button>
</div>
<div fxLayout.gt-md="row" fxLayoutWrap="wrap" fxLayoutAlign="space-around" fxLayout.xs="column">
<md-card class="setDetail" *ngIf="setDetail" fxLayout="row" fxLayout="column" fxLayoutWrap="wrap" fxLayoutAlign="space-around " fxFlex="30">
<md-card-header>
<img md-card-avatar src="{{setDetail.image}}" alt="" />
<md-card-title-group>
<md-card-title>
{{setDetail.name}}
</md-card-title>
<md-card-subtitle>
{{setDetail.idSet}}
</md-card-subtitle>
</md-card-title-group>
</md-card-header>
<md-card-content style="text-align: center;">
<div fxFlex="50" class="ml">
<md-icon class="left">bookmark_border</md-icon>
<p class="left">
{{setDetail.theme}}
</p>
</div>
<div fxFlex="50" class="mr">
<md-icon class="right">date_range</md-icon>
<p class="right" style="margin-right: 2px;">
{{setDetail.year}}
</p>
</div>
<hr />
<md-icon class="left">view_quilt</md-icon>
<p class="left">
{{setDetail.number}} {{'PARTS' | translate}}
</p>
<span *ngIf="auth.authenticated()">
<p class="right" *ngIf="update && model && model.status > 0">
{{model.status}} missing parts
</p>
<p class="right" *ngIf="update && model && model.status == 0">
Set full
</p>
<p class="right" *ngIf="!update">
Don't own
</p>
</span>
</md-card-content>
<md-card-actions class="btn" align="center">
<button class="btn-actions" md-raised-button color="primary" *ngIf="isView" (click)="getSetParts(); isView = false">{{'SEE_PARTS' | translate}}</button>
</md-card-actions>
<md-card>
<md-card-title *ngIf="update" fxFlex fxLayoutAlign="center">
{{'UPDATE_SET' | translate}}
</md-card-title>
<md-card-title *ngIf="!update" fxFlex fxLayoutAlign="center">
{{'ADD_SET' | translate}}
</md-card-title>
<md-card-content>
<div *ngIf="!sended && submitted" fxFlex fxLayoutAlign="center">
<md-progress-spinner mode="indeterminate"></md-progress-spinner>
</div>
<div *ngIf="sended" fxFlex fxLayoutAlign="center">
<h3>{{'SET_SAVED' | translate}}</h3>
</div>
<div *ngIf="!sended && !submitted">
<form fxFlex fxLayoutWrap="wrap" align="left" fxLayout="column">
<md-checkbox [(ngModel)]="model.instruction" name="instruction">
{{'INSTRUCTION' | translate}}
</md-checkbox>
<md-checkbox [(ngModel)]="model.box" name="box">
{{'BOX' | translate}}
</md-checkbox>
<md-checkbox [(ngModel)]="model.forPart" name="forPart">
{{'FOR_PARTS' | translate}}
</md-checkbox>
<md-input-container class="example-full-width">
<textarea mdInput style="width:100%;" id="comment" placeholder="{{'COMMENT' | translate}}" [(ngModel)]="model.note" name="comment"></textarea>
</md-input-container>
</form>
</div>
<md-card-actions *ngIf="!sended" align="center">
<button *ngIf="!update" class="btn-actions" md-raised-button color="accent" (click)="onSubmit()">{{'SUBMIT' | translate}}</button>
<button *ngIf="update" class="btn-actions" md-raised-button color="accent" (click)="onSubmit()">{{'UPDATE' | translate}}</button>
<button class="btn-actions" md-raised-button color="accent" *ngIf="update" (click)="deleted(setDetail)">{{'DELETE' | translate}}</button>
</md-card-actions>
</md-card-content>
</md-card>
</md-card>
<md-card fxLayoutAlign="space-around center" fxFlex="30">
<div fxFlex="100">
<img *ngIf="setDetail" md-card-image src="{{setDetail.image}}" alt="" />
</div>
</md-card>
<md-card *ngIf="setDetail && setDetail.setInstructions && setDetail.setInstructions.length > 0" fxFlex.gt-md="30" fxFlex>
<md-card-content style="text-align: center;">
<md-card-title style="text-align: center;">
{{ isInstructions }}
</md-card-title>
<div fxLayout="row" fxLayoutAlign="space-around" *ngIf="setDetail && setDetail.setInstructions" class="set_instruction">
<div fxFlex="20" *ngFor="let instruction of setDetail.setInstructions; let id=index">
<a>
<img src="{{instruction.frontPageInfo}}" alt="" fxFlex (click)="imgClicked($event.target, id)" [class.highlight]="isSelected(id)" />
<!--</span>--><br>
</a>
</div>
</div>
<md-divider></md-divider>
<div fxLayout="column" *ngIf="imgSelected >= 0 && setDetail && setDetail.setInstructions && setDetail.setInstructions.length > 0">
<div fxLayout="row" fxFlex="100">
<div fxFlex="100">
<img class="frontInstruction" src="{{setDetail.setInstructions[imgSelected].frontPageInfo}}" alt="" />
</div>
</div>
<span class="download-size">{{'DOWNLOAD_SIZE' | translate}}: {{setDetail.setInstructions[imgSelected].downloadSize}}</span><br>
<a class="instruction-id" target="_blank" href="{{setDetail.setInstructions[imgSelected].instruction}}"><button md-raised-button color="primary">
<md-icon>file_download</md-icon>
{{'SEE_INSTRUCTION' | translate}}</button></a><br>
<p>
{{'INSTRUCTION_TEXT_1' | translate}}
</p>
<p>
{{'INSTRUCTION_TEXT_2' | translate}}
</p>
</div>
</md-card-content>
</md-card>
</div>
<div id="target">
<md-card class="setParts" *ngIf="setParts">
<div class="btn" fxFlex fxLayoutAlign="center">
<button class="btn-toggle" md-raised-button color="primary" (click)="toggleButton()">Toggle</button>
</div>
<div *ngIf="setParts.results.length > 0">
<div class="btn" fxFlex fxLayoutAlign="center">
<button class="btn-page" md-raised-button [disabled]="buttonStatePrev()" (click)="page(0)">{{'PREV' | translate}}</button>
<button class="btn-page" md-raised-button [disabled]="buttonStateNext()" (click)="page(1)">{{'NEXT' | translate}}</button>
</div>
<md-grid-list cols="6">
<md-grid-tile *ngFor="let part of setParts.results; let last = last">
{{last ? scrollToParts() : ''}}
<div style="width:50%;">
<img style="width:100%;" src="{{part.colorPart.image}}" alt="" />
</div>
<md-grid-tile-footer [style.background-color]="changeBackground(part)" [style.color]="changeColor(part)">
<div fxFlex="100">
<p class="left">
<span *ngIf="part.isSpare">
In set
</span>
<span *ngIf="!part.isSpare">
Spare
</span>
</p>
<p class="right">
/ {{part.number}}
</p>
<select style="margin-top:1em;" class="nb-missing right" name="" (change)="onChange(part, $event.target.value)">
<option *ngFor="let i of part.number | myDemoNumber" [selected]="isMissing(part, i) == true">{{i}}</option>
</select>
<p class="right">
Missing:
</p>
</div>
</md-grid-tile-footer>
</md-grid-tile>
</md-grid-list>
<div class="btn" fxFlex fxLayoutAlign="center">
<button class="btn-page" md-raised-button [disabled]="buttonStatePrev()" (click)="page(0)">{{'PREV' | translate}}</button>
<button class="btn-page" md-raised-button [disabled]="buttonStateNext()" (click)="page(1)">{{'NEXT' | translate}}</button>
</div>
</div>
<md-card-content *ngIf="update && setParts.results.length <= 0">Your set is full</md-card-content>
</md-card>
</div>
</div>
<div class="error" *ngIf="errorMessage">{{errorMessage}}</div>and component:
import { Component, ViewChild, OnInit } from '@angular/core';
import { ActivatedRoute, Params, Router } from '@angular/router';
import { Location } from '@angular/common';
import { SetDetail } from './setDetail';
import { SetParts, Part } from './setParts';
import { NewSet } from './newSet';
import { Res } from './res';
import { Set } from './set';
import { SetService } from './set.service';
import { Auth } from '../auth/auth.service';
@Component({
selector: 'setDetail',
templateUrl: 'set.component.html',
styleUrls: ['set.component.css'],
providers: [SetService]
})
export class SetComponent implements OnInit {
public setDetail?: SetDetail;
public setParts?: SetParts;
public errorMessage: string;
public idSet?: string;
public isInstructions: string = 'Il n\'y a pas d\'instructions disponible.';
public isView: boolean = true;
public pag: number = 0;
public model: NewSet;
public sended?: NewSet;
public submitted: boolean = false;
public tata: {[ key: string ]: Res} = {};
public set?: Set;
public mySetParts: SetParts = {count: 0, previous: null, next: null, results: []};
public first: boolean = true;
public imgSelected: number = 0;
public shouldDoIt = true;
public update: boolean = false;
constructor(private setService: SetService,
private activatedRoute: ActivatedRoute,
private router: Router,
private location: Location,
private auth: Auth) {
}
public goToDetail(colorPart: Part): void {
let link = ['/colorPart', colorPart.colorPart.part.idPart, colorPart.colorPart.color.color];
this.router.navigate(link);
}
public getSetDetail(): void {
this.setService.getSetDetail(this.idSet).then((setDetail) => {
this.setDetail = setDetail;
if (this.setDetail.setInstructions.length !== 0) {
this.isInstructions = 'Instructions';
}
},
(error) => this.errorMessage = <any> error);
if (this.auth.authenticated()) {
this.setService.getMySet(this.idSet).subscribe((setList) => {
if (setList.count > 0) {
this.update = true;
this.model.box = setList.results[0].box;
this.model.instruction = setList.results[0].instruction;
this.model.note = setList.results[0].note;
this.model.status = setList.results[0].status;
this.model.forPart = setList.results[0].forPart;
}
},
(error) => this.errorMessage = <any> error);
}
};
public deleted(set: SetDetail) {
this.setService.deleteSet(set.idSet)
.subscribe((value) => {
this.update = false;
this.initForm();
},
(error) => this.errorMessage = <any> error);
}
public goBack(): void {
this.location.back();
}
public getSetParts(): void {
this.setService.getSetParts(this.idSet)
.subscribe((setParts) => {
this.setParts = setParts;
},
(error) => this.errorMessage = <any> error
);
this.getMySetParts();
}
public getMySetParts(): void {
if (this.auth.authenticated()) {
this.setService.getMySetParts(this.idSet).then((MySetParts) => {
this.mySetParts.count = MySetParts.count;
for (let part of MySetParts.results) {
this.mySetParts.results.push(part.setPart);
let obj: Res = {setPart: part.setPart, number: part.number};
this.tata[part.setPart.colorPart.color.color.toString()
+ part.setPart.colorPart.part.idPart.toString()] = obj;
}
;
},
(error) => this.errorMessage = <any> error);
}
}
public page(n: number): void {
if (n) {
this.setService.page(this.setParts.next)
.subscribe((setParts) => this.setParts = setParts,
(error) => this.errorMessage = <any> error);
this.pag += 1;
} else {
this.setService.page(this.setParts.previous)
.subscribe((setParts) => this.setParts = setParts,
(error) => this.errorMessage = <any> error);
this.pag -= 1;
}
}
public onSubmit(): void {
if (this.submitted === true) {
return;
}
let test: Res[] = [];
for (let key in this.tata) {
if (this.tata.hasOwnProperty(key)) {
test.push(this.tata[key]);
}
}
this.model.mySetParts = test;
this.submitted = true;
if (this.update === true) {
this.setService.updateSet(this.model).subscribe(
(data) => {
this.sended = data;
this.getSetDetail();
this.update = true;
this.submitted = false;
this.sended = null;
},
(error) => {
this.submitted = false;
this.errorMessage = <any> error;
}
);
} else {
this.setService.addSet(this.model).subscribe(
(data) => {
this.sended = data;
this.getSetDetail();
this.update = true;
this.submitted = false;
this.sended = null;
},
(error) => {
this.submitted = false;
this.errorMessage = <any> error;
}
);
}
}
public isMissing(part: Part, i: number): boolean {
if (this.tata[part.colorPart.color.color.toString() +
part.colorPart.part.idPart.toString()] &&
this.tata[part.colorPart.color.color.toString() +
part.colorPart.part.idPart.toString()].number === i) {
return true;
}
return false;
}
public onChange(setPart: Part, nbr: number): void {
let obj: Res = {setPart, number: nbr};
this.tata[setPart.colorPart.color.color.toString() +
setPart.colorPart.part.idPart.toString()] = obj;
}
public buttonStateNext(): boolean {
return this.setParts.next === null;
}
public buttonStatePrev(): boolean {
return this.setParts.previous === null;
}
public toggleButton(): void {
let tmp: SetParts;
tmp = this.setParts;
this.setParts = this.mySetParts;
this.mySetParts = tmp;
}
public imgClicked(event: any, id: number): void {
this.imgSelected = id;
}
public isSelected(id: number): boolean {
if (this.imgSelected === id || (this.imgSelected === id && id === 0)) {
return true;
}
return false;
}
public changeBackground(part: Part): string {
if (part.colorPart.color.rgb) {
if (part.colorPart.color.rgb === 'FFFFFF') {
return '#f2f2f2';
} else {
return '#' + part.colorPart.color.rgb;
}
}
return null;
}
public changeColor(part: Part): string {
if (part.colorPart.color.rgb === 'FFFFFF') {
return '#000000';
}
return null;
}
public ngOnInit(): void {
this.activatedRoute.params.forEach((params: Params) => {
this.idSet = params['id_set']; // (+) converts string 'id' to a number
});
this.initForm();
this.getSetDetail();
}
private initForm(): void {
this.set = {
idSet: this.idSet, year: null, nbParts: null,
theme: null, name: null, image: null
};
this.model = new NewSet(this.set, false, false, false, '', 0, []);
}
}
Solved : Problem came from a provider bad implemented. After a fix cause I found it ugly, this problem solved himself
Solved : Problem came from a provider bad implemented. After a fix cause I found it ugly, this problem solved himself