Angular 2 http.put - 无法读取未定义的 属性 'atualizaStatus'
Angular 2 http.put - Cannot read property 'atualizaStatus' of undefined
我正在尝试使用 put 方法更新我的应用程序上的字段,但是我在尝试执行此操作时遇到了一些问题。我是 Angular 2 的新手,但仍然不知道如何正确操作。
这是我的服务:
import {Injectable} from '@angular/core';
import {Http, Headers, Response, RequestOptions} from '@angular/http';
import {Component} from '@angular/core';
import {Observable} from 'rxjs/Rx';
import {DisputaPropostaComponent} from './disputas-proposta.component';
import 'rxjs/add/operator/map';
@Injectable()
export class DisputaPropostaService{
contato:Object[] = [];
name: string;
headers:Headers;
url: string = 'http://localhost:3004/disputas';
constructor(private http: Http){}
atualizaStatus (body:any): Observable<DisputaPropostaComponent[]>{
let bodyString = JSON.stringify(body); // Stringify payload
let headers = new Headers({ 'Content-Type': 'application/json' }); // ... Set content type to JSON
let options = new RequestOptions({ headers: headers }); // Create a request option
return this.http.put(`${this.url}/${body['id']}`, body, options)
.map((res:Response) => res.json()) // ...and calling .json() on the response to return data
.catch((error:any) => Observable.throw(error.json().error || 'Ocorreu um erro em nosso servidor, tente novamente mais tarde')); //...errors if any
}
}
这里是组件:
import { Component } from '@angular/core';
import {Http, Headers} from '@angular/http';
import {ActivatedRoute} from '@angular/router';
import {DisputaComponent} from '../../disputas/disputas.component';
import {DisputaService} from '../../disputas/disputas.service';
import {DisputaPropostaService} from './disputas-proposta.service';
import {disputaPropostas} from './proposta.interface';
@Component({
moduleId: module.id,
selector: 'detalhes',
templateUrl: `disputas-proposta.component.html`,
providers: [DisputaPropostaService]
})
export class DisputaPropostaComponent {
disputa: DisputaComponent;
service: DisputaService;
propostaService:DisputaPropostaService;
route: ActivatedRoute;
inputProposta = false;
proposta:disputaPropostas = {proposta_usuario: null, proposta_cliente: null}
constructor(service: DisputaService, route:ActivatedRoute, propostaService:DisputaPropostaService){
// Some other code here...
}
recusaProposta(){
if (this.disputa.propostas_realizadas == 0){
this.propostaService.atualizaStatus(this.disputa)
.subscribe(
res => console.log(res),
error=> console.log(error)
);
}
this.inputProposta = true;
this.disputa.propostas_realizadas++;
if ((this.disputa.propostas_realizadas) == ((this.disputa.maximo_propostas)-1))
alert("Ultima proposta")
}
我收到的消息如下:
Cannot read property 'atualizaStatus' of undefined
我是不是遗漏了什么明显的东西?提前谢谢你。
P.S.: 如果有人有文章解释 Angular 2 的 REST,我会很高兴知道:)
问题出在您的组件构造函数中
constructor(service: DisputaService, route:ActivatedRoute, propostaService: DisputaPropostaService){
this.service = service;
this.route = route;
this.propostaService = propostaService;
// ...
}
这是实现依赖注入的正确方式
删除
service: DisputaService;
propostaService:DisputaPropostaService;
route: ActivatedRoute;
更新
constructor(private service: DisputaService,private route:ActivatedRoute, private propostaService:DisputaPropostaService){
// Some other code here...
}
与 答案相同的结果
我发现这本书很有帮助。 https://angular-2-training-book.rangle.io/handout/di/
我正在尝试使用 put 方法更新我的应用程序上的字段,但是我在尝试执行此操作时遇到了一些问题。我是 Angular 2 的新手,但仍然不知道如何正确操作。
这是我的服务:
import {Injectable} from '@angular/core';
import {Http, Headers, Response, RequestOptions} from '@angular/http';
import {Component} from '@angular/core';
import {Observable} from 'rxjs/Rx';
import {DisputaPropostaComponent} from './disputas-proposta.component';
import 'rxjs/add/operator/map';
@Injectable()
export class DisputaPropostaService{
contato:Object[] = [];
name: string;
headers:Headers;
url: string = 'http://localhost:3004/disputas';
constructor(private http: Http){}
atualizaStatus (body:any): Observable<DisputaPropostaComponent[]>{
let bodyString = JSON.stringify(body); // Stringify payload
let headers = new Headers({ 'Content-Type': 'application/json' }); // ... Set content type to JSON
let options = new RequestOptions({ headers: headers }); // Create a request option
return this.http.put(`${this.url}/${body['id']}`, body, options)
.map((res:Response) => res.json()) // ...and calling .json() on the response to return data
.catch((error:any) => Observable.throw(error.json().error || 'Ocorreu um erro em nosso servidor, tente novamente mais tarde')); //...errors if any
}
}
这里是组件:
import { Component } from '@angular/core';
import {Http, Headers} from '@angular/http';
import {ActivatedRoute} from '@angular/router';
import {DisputaComponent} from '../../disputas/disputas.component';
import {DisputaService} from '../../disputas/disputas.service';
import {DisputaPropostaService} from './disputas-proposta.service';
import {disputaPropostas} from './proposta.interface';
@Component({
moduleId: module.id,
selector: 'detalhes',
templateUrl: `disputas-proposta.component.html`,
providers: [DisputaPropostaService]
})
export class DisputaPropostaComponent {
disputa: DisputaComponent;
service: DisputaService;
propostaService:DisputaPropostaService;
route: ActivatedRoute;
inputProposta = false;
proposta:disputaPropostas = {proposta_usuario: null, proposta_cliente: null}
constructor(service: DisputaService, route:ActivatedRoute, propostaService:DisputaPropostaService){
// Some other code here...
}
recusaProposta(){
if (this.disputa.propostas_realizadas == 0){
this.propostaService.atualizaStatus(this.disputa)
.subscribe(
res => console.log(res),
error=> console.log(error)
);
}
this.inputProposta = true;
this.disputa.propostas_realizadas++;
if ((this.disputa.propostas_realizadas) == ((this.disputa.maximo_propostas)-1))
alert("Ultima proposta")
}
我收到的消息如下:
Cannot read property 'atualizaStatus' of undefined
我是不是遗漏了什么明显的东西?提前谢谢你。
P.S.: 如果有人有文章解释 Angular 2 的 REST,我会很高兴知道:)
问题出在您的组件构造函数中
constructor(service: DisputaService, route:ActivatedRoute, propostaService: DisputaPropostaService){
this.service = service;
this.route = route;
this.propostaService = propostaService;
// ...
}
这是实现依赖注入的正确方式
删除
service: DisputaService;
propostaService:DisputaPropostaService;
route: ActivatedRoute;
更新
constructor(private service: DisputaService,private route:ActivatedRoute, private propostaService:DisputaPropostaService){
// Some other code here...
}
与
我发现这本书很有帮助。 https://angular-2-training-book.rangle.io/handout/di/