홈>
로컬 웹 서비스에서 데이터를 가져 오려고하지만 앱에서 값을 인쇄 할 수 없습니다
이것은 내 코드입니다 :
team-data.ts:
import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { map, catchError } from 'rxjs/operators';
import 'rxjs/add/operator/map';
@Injectable()
export class TeamDataProvider {
apiUrl="http://localhost/MyWebService/api/getteams.php";
constructor(public http: HttpClient) {
console.log('Hello TeamDataProvider Provider');
}
getTeams(): Observable<string[]> {
return this.http.get(this.apiUrl).pipe(
map(this.extractData),
catchError(this.handleError)
);
}
private extractData(res: Response) {
let body = res;
return body || {};
}
private handleError (error: Response | any) {
let errMsg: string;
if (error instanceof Response) {
const err = error || '';
errMsg = `${error.status} - ${error.statusText || ''} ${err}`;
} else {
errMsg = error.message ? error.message : error.toString();
}
console.error(errMsg);
return Observable.throw(errMsg);
}
getRemoteData(){
this.http.get(this.apiUrl).map(res => res).subscribe(data => {
console.log(data);
});
}
}
app.module.ts:
import { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, NgModule } from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
import { SplashScreen } from '@ionic-native/splash-screen';
import { StatusBar } from '@ionic-native/status-bar';
import { MyApp } from './app.component';
import { HomePage } from '../pages/home/home';
import { TeamDataProvider } from '../providers/team-data/team-data';
import { HttpClientModule } from '@angular/common/http';
@NgModule({
declarations: [
MyApp,
HomePage
],
imports: [
BrowserModule,
IonicModule.forRoot(MyApp),
HttpClientModule
],
bootstrap: [IonicApp],
entryComponents: [
MyApp,
HomePage
],
providers: [
StatusBar,
SplashScreen,
{provide: ErrorHandler, useClass: IonicErrorHandler},
TeamDataProvider
]
})
export class AppModule {}
home.ts:
import { TeamDataProvider } from '../../providers/team-data/team-data';
import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';
@Component({
selector: 'page-home',
templateUrl: 'home.html'
})
export class HomePage {
arrayTeam: Array<any> = [];
errorMessage: string;
constructor(public navCtrl: NavController, public navParams: NavParams, public teamDataProvider: TeamDataProvider) {
}
getTeam() {
this.teamDataProvider.getTeams()
.subscribe(
teams => this.arrayTeam = teams,
error => this.errorMessage = <any>error);
}
ionViewDidLoad(){
this.teamDataProvider.getRemoteData();
this.getTeam();
}
}
home.html :
<ion-header>
<ion-navbar>
<ion-title>
Team List
</ion-title>
</ion-navbar>
</ion-header>
<ion-content>
<ion-item>Team List</ion-item>
<ion-list *ngFor="let team of arrayTeam">
<ion-item >
<ion-item>id: {{team.id}} name: {{team.name}} member: {{team.member}}</ion-item>
</ion-item>
</ion-list>
</ion-content>
무엇이 잘못 되었나요? comand ionic serve를 실행할 때 :
Error trying to diff '[object Object]'. Only arrays and iterables are allowed
이것은 URL에서받은 날짜입니다 :
{
"teams": [
{
"id": 2,
"name": "updated",
"member": 4
},
{
"id": 3,
"name": "cambiato",
"member": 8
},
{
"id": 4,
"name": "test",
"member": 3
},
{
"id": 5,
"name": "sadasd",
"member": 2
}
]
}
- 답변 # 1
관련 자료
- javascript - 개체를 배열로 푸시하려고 할 때 Typescript "padStart"오류
- typescript - Angular에서 삭제 작업을 수행하려고 할 때 오류가 발생합니다
- github - git lfs 파일을 가져올 때 오류 발생 - 개체가 서버에 없습니다 : [404] 개체가 서버에 없습니다
- javascript - firebase-storage에서 다운로드 URL을 가져 오는 동안 오류가 발생했습니다
- typescript - 가상 몽구스 속성을 사용하여 TypeSrcipt 오류 "개체가 '정의되지 않음'일 수 있음"을 수정하는 방법
- python - 목록에 문자열을 삽입하려고 할 때이 오류가 발생하는 이유는 무엇입니까?
- c# - 단일성 - 객체에 두 개의 로컬 회전을 적용합니다 (컨트롤러 조이스틱의 회전을 3d 메시 조이스틱으로 다시 생성하려고 시도)
- c# - json 객체를 역 직렬화하는 동안 오류가 발생합니다
- sql - 오류 - 배열을 객체로 분해 할 수 없습니다
- python - Django Rest Framework에서 개체가 반복 가능한 오류가 아닙니다
- python - typeerror - 'nonetype'개체가 반복 할 수 없습니다이 오류가 발생한 이유는 무엇입니까?
- c - Break out을 시도하더라도 루프 구문 오류가 컴파일되지 않습니다
- javascript - 탐색에서 소품을 사용하려고 할 때 오류가 발생합니다
- c ++로 만든 java 코드를 다시 만들려고하는데 " 'rooms - : east'에 대한 정의되지 않은 참조"라는 오류가 계속 발생합니다
- html - 객체를 JavaScript의 함수로 전달할 때 잡히지 않은 구문 오류
- statistics - 의미를 만들려고 할 때 Python 색인 오류
- excel - 다른 통합 문서의 데이터에서 차트를 만들려고 할 때 런타임 오류 9
- r - Ubuntu 2004에서 Radian을 사용하여 패키지를 설치하는 중 오류 발생
- jwt-decode 객체 액세스시 Typescript 오류
- PomeloEntityFrameworkCoreMySql과 관련된 dotnet core 31에서 마이그레이션을 추가하려고 할 때 오류가 발생합니다
응답에 배열을 포함하는 객체가 있습니다.
구독시 해당 배열을 사용해야합니다 :