2016-04-29 3 views
3

У меня есть ошибка Angular 2, и, похоже, очень сложно найти место ошибки. Ошибка не обнаруживается во время компиляции, но браузер показывается при попытке загрузить страницу.Угловая ошибка 2

angular2-polyfills.js:349 Error: TypeError: Cannot read property 'prototype' of undefined 
     at __extends (http://localhost:3000/app/repository/award/award.service.js:7:72) 
     at eval (http://localhost:3000/app/repository/award/award.service.js:36:17) 
     at execute (http://localhost:3000/app/repository/award/award.service.js:47:14) 
    Error loading http://localhost:3000/app/main.js 

Может ли кто-нибудь указать мне правильное направление?

приложение/main.ts:

///<reference path="../../../node_modules/angular2/typings/browser.d.ts"/> 
import {bootstrap} from 'angular2/platform/browser'; 
import {HTTP_PROVIDERS} from 'angular2/http'; 
import {ROUTER_PROVIDERS} from 'angular2/router'; 
import {AppComponent} from './app.component'; 

bootstrap(AppComponent, [HTTP_PROVIDERS, ROUTER_PROVIDERS]) 
    .then(success => console.log(`Bootstrap success`)) 
    .catch(error => console.log(error)); 

хранилище:

import { Http, Response, Headers } from 'angular2/http'; 
import { Injectable } from 'angular2/core'; 
import { Observable } from 'rxjs/Observable'; 
import 'rxjs/add/operator/map'; 
import 'rxjs/add/operator/concatMap'; 
import 'rxjs/add/operator/do'; 
import 'rxjs/add/operator/catch'; 
// import { CONFIG } from '../shared/config'; 
import { IEntity } from './ientity'; 

@Injectable() 
export abstract class Repository<T extends IEntity> 
{ 
    protected url = null; 

    constructor(protected _http: Http) {} 

    add(entity: T) { 
    let headers = new Headers(); 
    let body = { 
     name: entity.name 
    }; 

    headers.append('Authorization', 'Basic'); 

    return this._http 
     .post(`${this.url}`, JSON.stringify(body), { 
     headers: headers 
     }) 
     .map(res => res.json()) 
     .catch(this.handleError); 
    } 

    delete(entity: T) { 
    let headers = new Headers(); 
    headers.append('Authorization', 'Basic'); 

    return this._http 
     .delete(`${this.url}/${entity.id}`, { 
     headers: headers 
     }) 
     .catch(this.handleError); 
    } 

    list() { 
    let headers = new Headers(); 
    headers.append('Authorization', 'Basic'); 

    return this._http.get(`${this.url}`, { 
     headers: headers 
    }) 
     .map((response: Response) => 
     <T[]>response.json().data 
    ) 
     // .do(items => console.log(items)) 
     .catch(this.handleError); 
    } 

    get(id: number) { 
    let headers = new Headers(); 
    headers.append('Authorization', 'Basic'); 

    return this._http.get(`${this.url}/${id}`, { 
     headers: headers 
    }) 
     .map((response: Response) => <T>response.json()) 
     .catch(this.handleError); 
    } 


    update(entity: T) { 
    let headers = new Headers(); 

    let body = { 
     name: entity.name 
    }; 

    headers.append('Authorization', 'Basic'); 

    return this._http 
     .put(`${this.url}/${entity.id}`, JSON.stringify(body), { 
     headers: headers 
     }) 
     .map(res => res.json()) 
     // .do(res => console.log(body)) 
     .catch(this.handleError); 
    } 

    private handleError(error: Response) { 
    console.error(error); 
    return Observable.throw(error.json().error || 'Server error'); 
    } 
} 

award.service:

import { Http } from 'angular2/http'; 
import { Injectable } from 'angular2/core'; 
import { CONFIG } from '../shared/config'; 
import { Repository } from '../core'; 
import { IAward } from './iaward'; 

@Injectable() 
export class AwardService extends Repository<IAward> 
{ 
    protected url = CONFIG.baseUrls.awards; 

    constructor(protected _http: Http) { 
    super(_http); 
    } 
} 
+0

Покажите нам ваше приложение/main.ts –

+0

@ DanielKucal, пожалуйста, см. Выше – Dblock247

+0

. Начнем с того, что вы помещаете 'HTTP_PROVIDERS' в массив начальной загрузки, но он нигде не импортируется. Попробуйте 'import {HTTP_PROVIDERS} с 'angular2/http';' и сообщите нам, где это вам. –

ответ

4

я воспроизвел, добавив следующее в мой проект:

export class Subclass extends Base {} 
class Base {} 

А затем работал вокруг ошибки путем определения базового класса первым:

class Base {} 
export class Subclass extends Base {} 

Пример: http://plnkr.co/edit/ge5gfckgXMp5ylUhKOEn - переместить базовый класс будет определен первый, и не ошибка. Похоже, что это может быть связано, но я не могу воспроизвести в сценарии с несколькими файлами.

+3

Я считаю, что это связано с тем, что в отличие от функций [классы не загружаются в JavaScript] (https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Classes#Hoisting), поэтому в то время, когда вы пытаетесь расширить 'Base', этот класс еще не существует. Спектр говорит, что это должно привести к ReferenceError, но поскольку этот код передается, а не использует собственные классы, вместо этого вы получаете более запутанную ошибку. –

Смежные вопросы