API post 调用冲突 Angular2 .map defaultOptions.merge 不是函数
API post call conflict Angular2 .map defaultOptions.merge is not a function in
我试图通过 post 方法调用 API,但出现此错误:
this._defaultOptions.merge 不是函数...
我正在检查一些答案,我尝试导入但不起作用
- 导入'rxjs/add/operator/map';
- 导入'rxjs/rx';
这是我的代码,如果你想试一试,请:
books.service.ts
import {Injectable} from 'angular2/core';
import {iBooks} from './books.interface';
import {Http, Response} from 'angular2/http';
import {Observable} from 'rxjs/Observable';
@Injectable()
export class bookService {
private _getApi = 'URLAPI';
constructor(private _http: Http) { }
getInfo(payload: any): Observable<iBooks[]> {
return this._http.post(this._getApi, payload)
.map((response: Response) => <iBooks[]>response.json())
.do(data => console.log("All: " + JSON.stringify(data)))
.catch(this.handleError);
}
private handleError(error: Response) {
console.error(error);
return Observable.throw(error.json().error || 'Server error');
}
}
也是组件
books.component.ts
import {iBooks} from './books.interface';
import {bookService} from './books.service';
@Component({
selector: 'books-list',
templateUrl: './books.component.html',
providers: [bookService]
})
export class bookComponent implements OnInit {
errorMessage: string;
trips: iBooks[];
_payload: bookMode;
constructor(private _bookService: bookService){
}
ngOnInit(): void {
this._bookService.getInfo(this._payload)
.subscribe(
trips => this.trips = trips,
error => this.errorMessage = <any>error);
}
}
export class bookMode{
Name: string;
Pages: number;
Items: number;
}
更新
books.interface.ts
export interface iBooks {
Name: string;
Pages: number;
Items: number;
}
更新 2
我包括了 app.component 和 main
main.ts
import {bootstrap} from 'angular2/platform/browser';
import {AppComponent} from './app.component';
import {provide} from 'angular2/core';
import {ROUTER_PROVIDERS} from 'angular2/router';
import 'rxjs/Rx';
import {HTTP_PROVIDERS, Headers, RequestOptions} from 'angular2/http'; // Required by credetials
class requestCredentials {
headers: Headers = new Headers({
'X-Requested-With': 'XMLHttpRequest'
});
withCredentials: boolean = true;
}
bootstrap(AppComponent, [ROUTER_PROVIDERS, HTTP_PROVIDERS, provide(RequestOptions, {useClass: requestCredentials})]);
app.component.ts
import {Component, ElementRef} from 'angular2/core';
import {RouteConfig, ROUTER_DIRECTIVES, RouterLink } from 'angular2/router';
import {HTTP_PROVIDERS} from 'angular2/http';
import 'rxjs/Rx';
import {EmptyComponent} from './myComponent.component'
@Component({
selector: 'my-app',
templateUrl: './myComponent.component.html',
directives: [ROUTER_DIRECTIVES, RouterLink]
})
export class AppComponent {
}
任何帮助都会很棒。
谢谢大家
将requestCredentials
改为
@Injectable()
export class requestCredentials extends RequestOptions {
constructor() {
let headers = new Headers();
headers.append('X-Requested-With', 'XMLHttpRequest');
super({method: RequestMethod.Get, headers: headers, withCredentials: true});
}
}
(未测试)
我试图通过 post 方法调用 API,但出现此错误:
this._defaultOptions.merge 不是函数...
我正在检查一些答案,我尝试导入但不起作用
- 导入'rxjs/add/operator/map';
- 导入'rxjs/rx';
这是我的代码,如果你想试一试,请:
books.service.ts
import {Injectable} from 'angular2/core';
import {iBooks} from './books.interface';
import {Http, Response} from 'angular2/http';
import {Observable} from 'rxjs/Observable';
@Injectable()
export class bookService {
private _getApi = 'URLAPI';
constructor(private _http: Http) { }
getInfo(payload: any): Observable<iBooks[]> {
return this._http.post(this._getApi, payload)
.map((response: Response) => <iBooks[]>response.json())
.do(data => console.log("All: " + JSON.stringify(data)))
.catch(this.handleError);
}
private handleError(error: Response) {
console.error(error);
return Observable.throw(error.json().error || 'Server error');
}
}
也是组件
books.component.ts
import {iBooks} from './books.interface';
import {bookService} from './books.service';
@Component({
selector: 'books-list',
templateUrl: './books.component.html',
providers: [bookService]
})
export class bookComponent implements OnInit {
errorMessage: string;
trips: iBooks[];
_payload: bookMode;
constructor(private _bookService: bookService){
}
ngOnInit(): void {
this._bookService.getInfo(this._payload)
.subscribe(
trips => this.trips = trips,
error => this.errorMessage = <any>error);
}
}
export class bookMode{
Name: string;
Pages: number;
Items: number;
}
更新
books.interface.ts
export interface iBooks {
Name: string;
Pages: number;
Items: number;
}
更新 2
我包括了 app.component 和 main
main.ts
import {bootstrap} from 'angular2/platform/browser';
import {AppComponent} from './app.component';
import {provide} from 'angular2/core';
import {ROUTER_PROVIDERS} from 'angular2/router';
import 'rxjs/Rx';
import {HTTP_PROVIDERS, Headers, RequestOptions} from 'angular2/http'; // Required by credetials
class requestCredentials {
headers: Headers = new Headers({
'X-Requested-With': 'XMLHttpRequest'
});
withCredentials: boolean = true;
}
bootstrap(AppComponent, [ROUTER_PROVIDERS, HTTP_PROVIDERS, provide(RequestOptions, {useClass: requestCredentials})]);
app.component.ts
import {Component, ElementRef} from 'angular2/core';
import {RouteConfig, ROUTER_DIRECTIVES, RouterLink } from 'angular2/router';
import {HTTP_PROVIDERS} from 'angular2/http';
import 'rxjs/Rx';
import {EmptyComponent} from './myComponent.component'
@Component({
selector: 'my-app',
templateUrl: './myComponent.component.html',
directives: [ROUTER_DIRECTIVES, RouterLink]
})
export class AppComponent {
}
任何帮助都会很棒。 谢谢大家
将requestCredentials
改为
@Injectable()
export class requestCredentials extends RequestOptions {
constructor() {
let headers = new Headers();
headers.append('X-Requested-With', 'XMLHttpRequest');
super({method: RequestMethod.Get, headers: headers, withCredentials: true});
}
}
(未测试)