指定されたパラメータは、コールターゲットのシグネチャと一致しません。 Herokuの配置

Question

"@angular/cli": "1.0.0", 
"@angular/compiler": "2.4.9", 
"@angular/compiler-cli": "2.4.9", 
"@angular/core": "2.4.9", 

これは私の最初の中型のangular2プロジェクトで、私はHerokuに展開しようとすると次のエラーが発生します。

ERROR in /tmp/build_517db5365a6effb7ffc72a360964722f/src/$$_gendir/app/modules/messages/components/list-messages.component.ngfactory.ts (440,79): Supplied parameters do not match any signature of call target.

package.jsonスクリプト：Herokuのに展開しようとしているローカルng build --prodを実行しているとき、私は同じエラーを取得していないときにこのエラーがのみ発生すること

"scripts": { 
    "ng": "ng", 
    "heroku-prebuild": "npm install -g http-server", 
    "heroku-postbuild": "ng build --prod", 
    "start": "http-server dist/", 
    "test": "ng test", 
    "lint": "ng lint", 
    "e2e": "ng e2e" 
    }, 

注意、コンパイルが終了エラーなし。

私は予想されるパラメータが不足している機能を探していましたが、コンポーネントはとてもシンプルなので、実際には見えません。ここで

は私のリスト-messages.component.tsです：

import { Injectable } from '@angular/core' 
import { Http, Headers, RequestOptions, URLSearchParams } from '@angular/http' 
import { Observable } from 'rxjs/Observable' 
import { environment } from '../../../../environments/environment' 
import 'rxjs/add/observable/throw' 
import 'rxjs/add/operator/map' 
import 'rxjs/add/operator/catch' 


@Injectable() 
export class MessagesService { 

    private baseUrl:string 
    private currentUser:any 
    private token:string 
    private headers:Headers 

    constructor(private http: Http){ 
     this.http = http 
     this.baseUrl = environment.api_url 
     this.currentUser = JSON.parse(localStorage.getItem('current-user')) 
     this.token = JSON.parse(localStorage.getItem('auth-token')) 
     this.headers = new Headers() 
     this.headers.append("Accept", "application/json") 
     this.headers.append("Content-Type", "application/json") 
     this.headers.append("x-user-id", this.currentUser._id) 
     this.headers.append("x-access-token", this.token) 
    } 

    /** 
    * Retrieves all messages 
    */ 

    getMessages(page?:string, limit?:string) { 
     let queryParam = new URLSearchParams() 
     queryParam.set('page', page) 
     queryParam.set('limit', limit) 
     let options = new RequestOptions({ headers: this.headers, search: queryParam }) 
     return this.http.get(this.baseUrl + '/messages', options) 
      .map(res => res.json()) 
      .catch(this.errorHandler) 
    } 

    /** 
    * Delete a specific message 
    * @param id 
    */ 

    deleteMessage(id) { 
     this.headers.delete('x-message-id') 
     this.headers.append('x-message-id', id) 
     let options = new RequestOptions({headers: this.headers}) 
     return this.http.delete(this.baseUrl + '/messages', options) 
      .map(res => res.json()) 
      .catch(this.errorHandler) 

    } 

    /** 
    * Error handler for all operations 
    * @param {Object} error 
    */ 

    errorHandler(error) { 
     return Observable.throw(error.json().error || 'Server Error') 
    } 
} 

そして、私のリストmessages.component：

import { Component } from '@angular/core' 
import { Router } from '@angular/router' 
import { MessagesService } from '../services/messages.service' 


@Component({ 
    templateUrl: 'list-messages.component.html', 
    providers: [ MessagesService ], 
    styleUrls: ['./list-messages.component.css'] 
}) 

export class ListMessagesComponent { 

    public messages: any 
    public search_q: any 
    public errors: string 
    public success: string 
    public page: any 
    private total: number 
    private limit: any 


    constructor(public router: Router, private messageService: MessagesService) {} 

    ngOnInit() { 
     this.page = 0 
     this.limit = 20 
     this.messageService.getMessages(this.page, this.limit) 
      .subscribe(res => { 
       console.log(res) 
       if (res.status == 200 && res.data.length > 0) { 
        this.messages = res.data 
        this.total = res.total 
       } else { 
        this.errors = res.message || "Unable to complete operation" 
       } 
      }) 
    } 

    /** 
    * On search event 
    */ 

    onSearch(query) { 
     this.search_q = query 
    } 

    deleteMessage(id) { 
     if (id) { 
      this.messageService.deleteMessage(id) 
       .subscribe(res => { 
        if (res.status == 200) { 
         this.messageService.getMessages(this.page, this.limit) 
          .subscribe(res => { 
           if (res.status == 200) { 
            this.success = "Message deleted" 
            this.messages = res.data 
            this.total = res.total 
           } else { 
            this.success = null 
            this.errors = res.message || "Unable to get messages" 
           } 
          }) 
        } 
       }) 
     } else { 
      this.success = null 
      this.errors = "Unknown message" 
     } 
    } 


    // -------- PAGINATION ------- // 

    /** 
    * Loads next page 
    * 
    */ 

    nextPage() { 
     this.page += 1 
     this.messageService.getMessages(this.page, this.limit) 
      .subscribe(res => { 
       if (res.status == 200) { 
        this.success = null 
        this.errors = null 
        this.messages = res.data 
        this.total = res.total 
       } 
      }) 
    } 

    /** 
    * Checks if there is a next page 
    */ 

    hasNextPage() { 
     return this.page * this.limit < this.total && this.messages.length == this.limit 
    } 

    /** 
    * Loads previous page 
    * 
    */ 

    prevPage() { 
     if (this.page > 0) { 
      this.page -= 1 
      this.messageService.getMessages(this.page, this.limit) 
       .subscribe(res => { 
        if (res.status == 200) { 
         this.success = null 
         this.errors = null 
         this.messages = res.data 
         this.total = res.total 
        } 
       }) 
     } 
    } 

    /** 
    * Checks if there is a previous page 
    * 
    */ 

    hasPrevPage() { 
     return this.page >= 1 
    } 

} 

、ここでは私のmessages.service.ts（念のため）です。 html：

<div class="row"> 
    <div class="col-lg-12"> 
     <div *ngIf="errors" class="error-container col-md-6"> 
      <div class="card card card-inverse card-danger"> 
       <div class="card-header"> 
        Error 
       </div> 
       <div class="card-block"> 
        <p>{{ errors }}</p> 
       </div> 
      </div> 
     </div> 
     <div *ngIf="success" class="error-container col-md-12"> 
      <div class="card card card-inverse card-primary"> 
       <div class="card-header"> 
        Success 
       </div> 
       <div class="card-block"> 
        <p>{{ success }}</p> 
       </div> 
      </div> 
     </div> 
     <div class="card" *ngIf="messages"> 
      <div class="card-header"> 
       <i class="fa fa-search"></i> Search 
      </div> 
      <div class="card-block"> 
       <input type="text" class="form-control" name="search_q" [(ngModel)]="search_q" (ngModelChange)="onSearch($event)"> 
      </div> 
     </div> 
     <div class="card" *ngIf="messages"> 
      <div class="card-header"> 
       <i class="fa fa-align-justify"></i> All Messages 
       <span class="total-count pull-right"> {{ total }}</span> 
      </div> 
      <div class="card-block"> 
       <table class="table table-condensed"> 
        <thead> 
         <tr> 
          <th> ID </th> 
          <th> Email </th> 
          <th> Message </th> 
          <th> Date sent </th> 
          <th> Actions </th> 
         </tr> 
        </thead> 
        <tbody> 
         <tr *ngFor="let message of messages | messageFilter:search_q"> 
          <td>{{ message._id }}</td> 
          <td>{{ message.email }}</td> 
          <td>{{ message.message | truncate :15 }}</td> 
          <td>{{ message.date_sent | date: 'dd/MM/yyyy' }}</td> 
          <td> 
           <a href="mailto:{{ message.email }}" class="btn btn-primary">Respond</a> 
           <button class="btn btn-danger" (click)="deleteMessage(message._id)"> Delete </button> 
          </td> 
         </tr> 
        </tbody> 
       </table> 
       <div class="pagination pull-right"> 
        <button class="pagination-button" id="prev-page" (click)="prevPage()" [disabled]="!hasPrevPage()">Prev</button> 
        <button class="pagination-button" id="next-page" (click)="nextPage()" [disabled]="!hasNextPage()">Next</button> 
       </div> 
      </div> 
     </div> 
    </div> 
</div> 

ご意見やご提案は歓迎します。

ありがとうございます！

Answer 1

パラメータを必要とするすべてのあなたの方法は、それに関連付けられた型を持っている必要があり、例えばあなたのdeletemessageパラメータIDは、型を持っている必要があり、

変更を誤り、問題がであることを示し

deleteMessage(id:any) { 
}