Angular2：ERRORエラー：InvalidPipeArgument：パイプ 'AsyncPipe'とAngular2のエラー：エラーTypeError：nullのプロパティ 'dispose'を読み取ることができません

Question

私はangular2を初めて使用しました。私のテンプレートでは、サービスは休憩サービスから来ているJsonデータです。 "ウェルリスト"： "{"国 "：" IDN "、"ウェル "："テスト "、"坑井 "：" N "、"会社 "："テスト "、"アクティブ "：" N " 「国」：「IDN」「ウェル」「テスト」「ウェルボア」「N」「会社」「テスト」「アクティブ」「Y」}、{"国" 「IDN」、「ウェル」：「テスト」、「ウェルボア」：「N」、「会社」：「テスト」、「アクティブ」：「Y」}、{「国」：「IDN」、「ウェル」： {"国"： "IDN"、 "ウェル"： "テスト"、 "ウェルボア"： "テスト"、 "ウェルボア"： "N"、 "会社" N」、 "会社"： "テスト"、 "アクティブ"： "Y"}]}

以下は、私は私のテンプレートに書かれているコードです：

<ul> 
<li *ngFor="let well of wells | async"> 
    <table> 
     <tr> 
     <th scope="col">Active</th> 
     <th scope="col">Company</th> 
     <th scope="col">Country</th> 
     <th scope="col">Well</th> 
     <th scope="col">Wellbore Indicator</th> 
     </tr> 
     <tr> 
     <td>{{well.active}}</td> 
     <td>{{well.company}}</td>  
     <td>{{well.country}}</td> 
     <td>{{well.well}}</td> 
     <td>{{well.wellbore}}</td> 
     </tr> 
     </table> 
    </li> 
    </ul> 

しかし、運それは動作していません。以下の2つのエラーがあります。

ERRORエラー：InvalidPipeArgument： '' パイプのための 'AsyncPipe' invalidPipeArgumentErrorで（common.es5.js：2610） 共通/角度@/AsyncPipe.webpackJsonp .../../.. /共通で。 es5.js.AsyncPipe._selectStrategy（common.es5.js：2755） asyncPipe.webpackJsonp .../../../common/@angular/common.es5.js.AsyncPipe._subscribe（common.es5。 JS：2741） AsyncPipe.webpackJsonp .../../../common/@angular/common.es5.js.AsyncPipe

エラーTypeError例外で：プロパティを読み取ることができませんがAsyncPipeでヌル の '処分します'。 webpackJsonp .../../../common/@angular/common.es5.js.AsyncPipe._dispose（common.es5.js：2761） asyncPipe.webpack JSONP .../../../common/@angular/common.es5.js.AsyncPipe.transform（common.es5.js：2725）

誰もがこの

を取り除くためにどのように私を助けることができます

コンポーネント：

import { Component, OnInit } from '@angular/core'; 
import { UserService } from '../services/user.service'; 
import { User } from '../user/user'; 
import { Observable } from 'rxjs/Rx'; 
@Component({ 
    selector: 'app-well', 
    templateUrl: './well.component.html', 
    styleUrls: ['./well.component.css'], 
    providers:[UserService] 
}) 
export class WellComponent implements OnInit { 
    title = 'Wells'; 
    wells: User[]; 
    errorMessage: string; 
    constructor(private userService:UserService) { 
    this.wells = []; 

    } 

    ngOnInit() { 
    let self = this; 
    self.userService.getWells().subscribe(response => this.wells = response, error => this.errorMessage = <any> error); 
    } 

} 

はサービス：

import { Injectable } from '@angular/core'; 
import { Http, Headers, RequestOptions, Response } from '@angular/http'; 
import { Observable,Subject } from 'rxjs/Rx'; 
import 'rxjs/add/operator/toPromise'; 
import { User } from '../user/user'; 
import 'rxjs/Rx'; 
@Injectable() 
export class UserService { 
    //private jsonFileURL: string='/assets/wells.json'; 

    constructor(private http:Http) { } 
    getWells(): Observable <User[]> { 
    return this.http.get('http://localhost:8080/RESTfulExample/rest/auth/testuser1/pass',{headers:this.getHeaders()}).map((response: Response) => { 
     return <User[] > response.json(); 
    }).catch(this.handleError); 
} 
//  
private handleError(errorResponse: Response) { 
    console.log(errorResponse.statusText); 
    return Observable.throw(errorResponse.json().error || "Server error"); 
} 
private getHeaders(){ 
    // I included these headers because otherwise FireFox 
    // will request text/html instead of application/json 
    let headers = new Headers(); 
    headers.append('Accept', 'application/json'); 
    return headers; 
    } 

} 

Answer 1

ERRORエラー：InvalidPipeArgument： '' パイプのための 'AsyncPipe'、私はあなたがチェックしなければならないと思うあなたはすでに目にAsynceパイプが含まれていますe app.module.ts ???このエラーはそれらを持っていないことを通知しているためです。そして、このエラーTypeError： 'AsyncPipe'を実行できなくなった後、ログにnullのプロパティ 'dispose'を読み込めません。これがあなたの固定を助けることを望みます

Answer 2

asycnPipeはnull、EventEmitter、promiseおよびObservableとしか扱わない、wellsはオブジェクト（JSONオブジェクト）です。 enter link description here