2016-04-29 3 views
1

У меня есть приложение с угловым 2, которое я обновил сегодня с бета1 до бета -16. Он отлично работает на бета1, но не на 16. Я получаю эту ошибку:ИСКЛЮЧЕНИЕ: TypeError: Невозможно прочитать свойство «подписаться» неопределенного после обновления

angular2.dev.js:24821 TypeError: Cannot read property 'subscribe' of undefined 
    at AppView._View_ApplicationForm0.createInternal (ApplicationForm.template.js:825) 
    at AppView.create (angular2.dev.js:22641) 
    at AppView._View_Home5.createInternal (Home.template.js:509) 
    at AppView.create (angular2.dev.js:22641) 
    at TemplateRef_.createEmbeddedView (angular2.dev.js:4186) 
    at ViewContainerRef_.createEmbeddedView (angular2.dev.js:5742) 
    at NgIf.Object.defineProperty.set [as ngIf] (angular2.dev.js:10003) 
    at AppView._View_Home0.detectChangesInternal (Home.template.js:848) 
    at AppView.detectChanges (angular2.dev.js:22811) 

У меня есть пример на plnkr, который работает просто отлично, но это не работает на моем местном. Работает только с бета1. Вот мой plnkr:

http://plnkr.co/edit/eZJYOVsvFeglfJmuIHpp?p=preview

app.ts

import {Component} from 'angular2/core' 
import {Form} from 'src/frm' 
@Component({ 
    selector: 'my-app', 
    providers: [], 
    template: ` 
    <div> 
     <frm (submitted) = "submitted()"></frm> 
    </div> 
    `, 
    directives: [Form] 
}) 
export class App { 
    constructor() { 
    this.name = 'Angular2' 
    } 

    submitted(){ 
    console.log('clicked'); 
    } 
} 

frm.ts

import {Component, EventEmitter} from 'angular2/core' 

@Component({ 
    selector: 'frm', 
    providers: [], 
    template: ` 
    <div> 
     <h2>Form</h2> 
     <button (click) = "clicked()">Go</button> 
    </div> 
    `, 
    directives: [], 
    outputs: ['submitted', 'canceled'] 
}) 
export class Form { 

    submitted: EventEmitter<any> = new EventEmitter<any>(); 

    canceled: EventEmitter<any> = new EventEmitter<any>(); 

    constructor() { 

    } 

    clicked(){ 
    this.submitted.emit(null); 

    } 
} 

Если удалить привязку события, он будет работать. Как это:

<frm></frm> 

Вот мой package.json:

{ 
    "name": "angular2-quickstart", 
    "version": "1.0.0", 
    "scripts": { 
    "postinstall": "npm run typings install", 
    "tsc": "tsc", 
    "tsc:w": "tsc -w", 
    "lite": "lite-server", 
    "start": "concurrent \"npm run tsc:w\" \"npm run lite\" ", 
    "typings": "typings" 
    }, 
    "license": "ISC", 
    "dependencies": { 
    "angular": "~1.5.0", 
    "angular-animate": "~1.5.0", 
    "angular-aria": "~1.5.0", 
    "angular-material": "~1.0.5", 
    "angular-ui-bootstrap": "~1.1.2", 
    "angular2": "2.0.0-beta.16", 
    "es6-promise": "^3.0.2", 
    "es6-shim": "^0.35.0", 
    "jquery": "~2.2.0", 
    "ng2-bootstrap": "~1.0.3", 
    "reflect-metadata": "0.1.2", 
    "rxjs": "5.0.0-beta.2", 
    "systemjs": "0.19.26", 
    "zone.js": "0.6.12" 
    }, 
    "devDependencies": { 
    "concurrently": "^2.0.0", 
    "lite-server": "^2.2.0", 
    "typescript": "^1.8.10", 
    "typings": "^0.8.1" 
    } 
} 
+0

Теперь есть бета-версия.17. Кроме того, возможно, вам следует обновить и другие зависимости. – acdcjunior

+0

Невозможно обновить до 17, поскольку ng2-bootstrap все еще не в 17. Я не ожидаю, что 17 исправит это. –

ответ

0

проблема заключалась в том, что мне не хватает ключевого слова tools.

+0

как didi u разрешить это? –

+0

Как я уже упоминал, мне не хватало ключевое слово tools для моего компонента для реализации класса. Я добавил это, и это сработало. –

1

Там, кажется, несколько ошибок в вашем app.js файле:

(1) Объявить переменную name на наверху класса перед его доступом, примерно так: name:string;

(2) Импорт должен быть таким: import {Form} from './frm'

+0

На самом деле это не ошибка. Помните, что все работает, если я удалил свою подписку на события. –

+0

Все работало отлично для меня с вышеупомянутыми предложениями. Я тестировал на бета-версии 16. – siva636

+0

Я обновил вопрос с пакетом Package.json, который у меня есть. Не возражаете ли вы проверить это, если мне не хватает, чтобы что-то обновить? –

3

Я думаю, что проблема может быть связана с созданием ваших выходов. Вот правильный способ сделать (один из рабочей pkunkr):

submitted: EventEmitter<any> = new EventEmitter<any>(); 

По ошибке, Angular2 не может подписаться на них, так как они не определены. Вы уверены, что они создавались так же в локальном коде тура?

+0

Это помогло мне разобраться после того, как я наткнулся на минуту. Спасибо за быстрое, краткое объяснение! –

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