Question

我有一个角度2应用程序，我今天从beta1升级到beta16。它在beta1上工作正常，但不在16上。我收到此错误：

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上有一个工作正常的例子，但是这对我的本地不起作用。仅适用于beta1。这是我的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"
  }
}

Answer 1

我认为问题可能与您的输出实例化有关。这是正确的方法（来自你工作的pkunkr的那个）：

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

根据错误，Angular2无法订阅，因为它们未定义。你确定他们在旅游本地代码中以相同的方式实例化了吗？

Answer 2

您的app.js文件中似乎有一些错误：

（1）在访问之前在类的顶部声明name变量，类似于：name:string;

（2）导入应该是这样的：import {Form} from './frm'

Answer 3

问题是我缺少implements关键字。

EXCEPTION：TypeError：升级后无法读取未定义的属性'subscribe'

3 个答案: