ng build --prod --aot Supplied parameters do not match any signature of call target

ng build --prod --aot Supplied parameters do not match any signature of call target

package.json

{
  "name": "CoreUI",
  "version": "1.0.0-alpha.4",
  "description": "Open Source Bootstrap Admin Template",
  "author": "",
  "url": "http://coreui.io",
  "copyright": "Copyright 2017 creativeLabs Łukasz Holeczek",
  "license": "MIT",
  "angular-cli": {},
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/common": "2.4.9",
    "@angular/compiler": "2.4.9",
    "@angular/core": "2.4.9",
    "@angular/forms": "2.4.9",
    "@angular/http": "2.4.9",
    "@angular/platform-browser": "2.4.9",
    "@angular/platform-browser-dynamic": "2.4.9",
    "@angular/router": "3.4.9",
    "@angular/upgrade": "2.4.9",
    "chart.js": "2.5.0",
    "core-js": "2.4.1",
    "moment": "2.17.1",
    "ng2-bootstrap": "1.4.0",
    "ng2-charts": "1.5.0",
    "ng2-file-upload": "^1.2.0",
    "ng2-validation": "^4.2.0",
    "ng2-validation-manager": "^0.3.1",
    "ngx-paginator": "0.0.14",
    "primeng": "^1.0.0",
    "rxjs": "5.2.0",
    "ts-helpers": "1.1.2",
    "underscore": "^1.8.3",
    "zone.js": "0.7.2"
  },
  "devDependencies": {
    "@angular/cli": "^1.0.0",
    "@angular/compiler-cli": "2.4.9",
    "@types/jasmine": "2.5.45",
    "@types/node": "7.0.8",
    "codelyzer": "2.0.1",
    "jasmine-core": "2.5.2",
    "jasmine-spec-reporter": "3.2.0",
    "karma": "1.5.0",
    "karma-chrome-launcher": "2.0.0",
    "karma-cli": "1.0.1",
    "karma-jasmine": "1.1.0",
    "karma-jasmine-html-reporter": "0.2.2",
    "karma-coverage-istanbul-reporter": "0.3.0",
    "protractor": "5.1.1",
    "ts-node": "2.1.0",
    "tslint": "4.5.1",
    "typescript": "2.2.1",
    "@types/underscore": "^1.7.33"
  }
}

ts

import { Component, Input, Output, EventEmitter, OnInit, OnChanges } from '@angular/core';
import * as createArray from 'underscore';

@Component({
    selector: 'page',
    templateUrl: './page.component.html',
    styleUrls: ['./page.component.scss']
})
export class pageComponent implements OnInit,OnChanges {
    @Input() currentPage:number = null;   //当前页码
    @Input() pageSize:number = null;      //每页个数
    @Input() totalPages:number = null;    //总页数
    @Input() totalAmount:number = null;   //数据总个数
    @Output() onPageChange = new EventEmitter();
    gotoPage:number = null;
    // pager object
    pager: any = {};
    constructor() {}
    ngOnInit(){
        //  this.setPage(this.currentPage);
    }
    ngOnChanges() {
        this.setPage(this.currentPage);
    }
    
    setPage(currentPage) {
        if (currentPage < 1 || currentPage > this.pager.totalPages) {
            return;
        }
        // 数据总个数 当前页 每页个数
        if(this.totalAmount != undefined && this.pageSize != undefined && this.totalPages != undefined){
            this.pager = this.getPager(this.totalAmount, currentPage, this.pageSize, this.totalPages);
            // 向父组件传递
            debugger
            this.onPageChange.emit(this.pager);
        }
       
    }

    clickSetPage(){
        if(this.gotoPage != null){
            this.setPage(this.gotoPage);
        }
    }

    getPager(totalAmount: number, currentPage: number , pageSize: number, totalPages:number ) {
        let _totalPages = totalPages;
        let _totalAmount = totalAmount;
        let startPage: number, endPage: number;
        if (_totalPages <= 10) {
            // less than 10 total pages so show all
            startPage = 1;
            endPage = _totalPages;
        } else {
            // more than 10 total pages so calculate start and end pages
            if (currentPage <= 6) {
                startPage = 1;
                endPage = 10;
            } else if (currentPage + 4 >= _totalPages) {
                startPage = _totalPages - 9;
                endPage = _totalPages;
            } else {
                startPage = currentPage - 5;
                endPage = currentPage + 4;
            }
        }
        // calculate start and end item indexes
        let startIndex = (currentPage - 1) * pageSize;
        let endIndex = Math.min(startIndex + pageSize - 1, _totalAmount - 1);
        // create an array of pages to ng-repeat in the pager control
        let pages = createArray.range(startPage, endPage + 1);
        // return object with all pager properties required by the view
        return {
            totalAmount: _totalAmount,
            currentPage: currentPage,
            pageSize: pageSize,
            totalPages: _totalPages,
            startPage: startPage,
            endPage: endPage,
            startIndex: startIndex,
            endIndex: endIndex,
            pages: pages
        };
    }
}```

# html
```html
<div>

    <div class="clearfix">
        <!-- pager -->
        <ul *ngIf="pager.pages && pager.pages.length" class="pagination">
            <li [ngClass]="{disabled:pager.currentPage === 1}">
                <a (click)="setPage(1)">首页</a>
            </li>
            <li [ngClass]="{disabled:pager.currentPage === 1}">
                <a (click)="setPage(pager.currentPage - 1)">上一页</a>
            </li>
            <li *ngFor="let page of pager.pages" [ngClass]="{active:pager.currentPage == page}">
                <a (click)="setPage(page)">{{page}}</a>
            </li>
            <li [ngClass]="{disabled:pager.currentPage === pager.totalPages}">
                <a (click)="setPage(pager.currentPage + 1)">下一页</a>
            </li>
            <li [ngClass]="{disabled:pager.currentPage === pager.totalPages}">
                <a (click)="setPage(pager.totalPages)">尾页</a>
            </li>
        </ul>
        <span class="infoTextAndGoPageBtnWrap">
                <span class="totalText">
                    当前第<span class="currPageNum">{{ pager.currentPage }}</span>页
        <span class="totalInfoSplitStr">/</span> 共
        <span class="totalPageNum">{{ pager.totalPages }}</span>页
        </span>
        <span class="goPageBox">
                    &nbsp;转到
                    <span id="gopage_wrap">
                        <input type="number" name="gotoPage" [(ngModel)]="gotoPage" class="page-input">
                    </span>页
        <button type="button" class="btn-go-page" (click)="clickSetPage(gotoPage)">确定</button>
        </span>
        </span>
    </div>
</div>

<page [currentPage]="page.current" [pageSize]="page.size" [totalPages]="page.pages" [totalAmount]="page.total" (onPageChange)="paginate($event)"></page>

paginate(event) { debugger this.page.current = event.currentPage; }

[opiepj]

@HazizKhan @wy8473979981 I would highly recommend using AOT for its performance and development capabilities. Also, the Angular team is planning on requiring AOT in their future release.

To solve the issue you had @wy8473979981 was a simple incorrect param alignment.

Your View:

<button type="button" class="btn-go-page" (click)="clickSetPage(gotoPage)">确定</button>

Your Component:

clickSetPage() { // <-- no gotoPage
        if(this.gotoPage != null){
            this.setPage(this.gotoPage);
        }
    }

In your html you are trying to call clickSetPage by passing in gotoPage. In your component your method clickSetPage has no assigned parameter, the AOT compiler is simply telling you this is a mistake and cannot compile.

The AOT compiler is essentially compiling the HTML templates for you so the users don’t have to compile on the run time. Plus having AOT reduces your file size by about 100% (the compiler is really large).

[opiepj]

You didn’t solve it, you just turned off AOT…