2017-05-08 18 views
1

ウェブプログラミングに問題があります。Angular2 map - > subscribeデータ型エラー( 'ErrorObservable'型にプロパティ 'length'が存在しません)

私はHTTP通信を使用して、 'map'を呼び出して配列データを渡したいと思います。

makeTables(json:string) { 
    let arr:Array<any> = []; 
    ... 

    return arr; 
} 

query(spName: string, objParam: Array<any>) { 
    return this.http.post(this.url, this.data) 
      .map(x => this.makeTables(x.json())); 
}; 

login(username: string, password: string) { 
     let ret = this.mysql.query("sp_admin_login", [username, password]); 

     ret.subscribe(x => { 
      // ERROR !!!!!!!!! 
      console.log(x.length); 

      if(1 ==1 /*user && user.token*/) { 
       localStorage.setItem("user", "user"); 
      } else { 
      // Q2 
       // ret.mockError(new Error('Username or password is incorrect')); 
      } 
     }); 

     return ret; 
    } 

// ERROR !!!!!!!!

プロパティ:

エラーが

エラーメッセージが

/admin/src/app/_authentication/authentication.service.ts(17,27)でアクセスするx.lengthに表示されます'長さ'は型 'any []には存在しません| ErrorObservable 'です。
プロパティ 'length'がタイプ 'ErrorObservable'に存在しません。


そして、2つ目の質問:私は、エラーメソッドを呼び出すことができますどのように

? (// Q2)

ret.mockError(new Error('Username or password is incorrect')); 

答えて

2

あなたのエディタが呼び出し元のメソッドの戻り値の型を参照しますデフォルトでは、あなたのコールバックでデータ型については言及していドン場合。したがってquery()メソッドはArray<any>を返すか、タイプErrorObservableのエラーをスローすることができます。成功の長さをチェックしたい場合は、コールバックをタイプする必要があります。 ret.subscribe((x : Array<any>) => {});

login(username: string, password: string) { 
     let ret = this.mysql.query("sp_admin_login", [username, password]); 

     ret.subscribe((x : Array<any>) => { 
      // x is a known array now 
      console.log(x.length); 


      if(1 ==1 /*user && user.token*/) { 
       localStorage.setItem("user", "user"); 

      } else { 
      // Q2 
       this.mockError(new Error('Username or password is incorrect')); 
      } 
     }); 

     return ret; 
    } 

すでにエラーメソッドがあると仮定してエラー処理が行われます。これは、角度エラーではありませんが、ログインが成功しなかった場合に呼び出すので、認証エラーです。アプリケーションのエラー処理のために、このようなメソッドを使用するのは適切ではありません。しかし、これは角度誤差を処理す​​るのに役立ちます。

mockError(error){ 
    if(error instanceof Error){ 
    // log error here 
    console.log(error); 
    } 
} 
+1

あなたの答えは美しい!!そして驚くべきこと!! –

関連する問題