2016-12-08 44 views
2

我已經看到過這個錯誤很多次,我能找到的就是我需要確保我的服務在我的app.modules中提供,然後在我的組件的構造函數中調用它。我已經完成了這個工作,但仍然遇到了錯誤。我的應用程序中也有http和HTTPMODULES。只有在我的應用程序中使用刪除功能時纔會出現該錯誤。以下是錯誤error_handler.js:45 EXCEPTION: Cannot read property 'get' of undefined,這裏是一些相關的代碼....Angular 2無法讀取undefined的屬性'get'

app.module.ts

import { NgModule }  from '@angular/core'; 
    import { BrowserModule } from '@angular/platform-browser'; 

    import { HttpModule, JsonpModule }  from '@angular/http'; <------------HTTP 

    import { AppComponent } from './app.component'; 
    import { PostRantComponent } from './postRant.component'; 
    import { PostDataService } from './PostData.Service'; <------------service 
    import { Constants } from './app.const.service'; 



    import { Routing } from './app.routes'; 
    import { FormsModule } from '@angular/forms'; 


    @NgModule({ 
     imports: [NgbModule.forRoot(), BrowserModule, Routing, FormsModule, HttpModule, JsonpModule], 
     declarations: [AppComponent,,PostRantComponent], 
     providers: [PostDataService, Constants], 
     bootstrap: [AppComponent] 
    }) 
    export class AppModule { } 

服務(試圖削減下來只顯示相關代碼)

import { Injectable } from '@angular/core'; 
import { Http, Response, Headers } from '@angular/http'; 
import 'rxjs/add/operator/map'; 
import 'rxjs/add/operator/catch'; 
import { Observable } from 'rxjs/Observable'; 
import { PostViewModel } from './models/Post'; 
import { Constants } from './app.const.service'; 

@Injectable() 
export class PostDataService{ 

private actionUrl: string; 
private headers: Headers; 
constructor(private _http: Http, private _constants: Constants){ 

    this.actionUrl = _constants.ServerWithApi; 

    this.headers = new Headers(); 
    this.headers.append('Content-Type', 'application/json'); 
    this.headers.append('Accept','application/json'); 
} 

public GetAll =(): Observable<PostViewModel[]> => { 
    return this._http.get(this.actionUrl) 
    .map((response: Response) => <PostViewModel[]>response.json()) 
    .catch(this.handleError); 
} 

public Delete = (id: string) =>{ 
    return this._http.delete(this.actionUrl + id) 
     .map(res => res.json()) 
     .catch(this.handleError); 
}  

} 

組件

import { Component, Attribute, OnInit,ViewChild } from '@angular/core'; 
import { PostViewModel } from './models/Post'; 
import { PostDataService } from './PostData.Service'; 
import { Constants } from './app.const.service'; 

@Component({ 
    selector: 'postRant', 
    templateUrl: 'html/postRant.html', 
}) 
export class PostRantComponent implements OnInit { 
    txtTitle: string; 
    txtDescription: string; 

    public myPosts : Array<PostViewModel>; 
    public newPost : PostViewModel = new PostViewModel(); 
    constructor(private auth:Auth, private _dataservice: PostDataService){ 

    } 

ngOnInit(){ 
    this.getAllItems(); 
} 

private getAllItems():void { 
    this._dataservice 
    .GetAll() 
    .subscribe((Post: Array<PostViewModel>) => this.myPosts = Post, 
     error => console.log(error), 
     () => console.log('get all items complete')) 
} 

delete(id){ 
    console.log(id); 
    this._dataservice.Delete(id) 
    .subscribe((res) => { 
     this.myPosts = res; 
    }); 
     var index = this.myPosts.findIndex(x => x.id == id); 
     this.myPosts.splice(index, 1); 
    } 
} 

如果您對我的git上的所有代碼感興趣,我的git位於here,但它相當大。

編輯 圖片錯誤的.... enter image description here看來,錯誤是由線52產生的PostData.Service.tsvar applicationError = error.headers.get('Application-Error');

回答

1

讓我猜猜,你GETALL HTTP調用的示數但您要求的數據服務器不是返回數據的格式爲error.headers

將第debugger;加到第e handleError並檢查它正在接收的對象。

+0

你是對的,問題不在我的應用程序的前端,它在我的api後端。謝謝! – Bean0341

相關問題