Angular 2自定义表单输入：无法读取未定义的属性订阅

Question

我试图创建一个自定义表单输入文件上传角2基于此后角2自定义表单输入，但我以下错误错误

zone.js:446未处理的promise拒绝：无法读取未定义的属性订阅；区域：角；任务：Promise.then；值：类型错误：无法读取未定义的属性订阅（...）

我的代码是

import {
  Component,
  Directive,
  EventEmitter,
  Provider,
} from 'angular2/core';

import { NG_VALUE_ACCESSOR } from 'angular2/common';
import { CONST_EXPR } from 'angular2/src/facade/lang';
import { forwardRef } from 'angular2/src/core/di';

@Component({
  selector: 'file-upload',
  template: `<div
class="drop-zone"
(dragover)="dragover = true"
(dragleave)="dragover = false"
(drop)="handleFiles($event); $event.preventDefault();"
[ngClass]="{'dragover':dragover}"
>
  Drop file here
</div>
<input type="file" (change)="handleFiles($event)" id="fileup"> <label for="fileup" class="button">Upload File</label>
<br>`,
  styles: [require('./file-upload.component.sass')],
  outputs: ['fileChange'],
})
export class FileUploadComponent {
  constuctor() {
    this.fileChange = new EventEmitter(false);
  }
  setValue(value) {
    this.image = value;
  }
  handleFiles(event) {
    event.preventDefault();
    event.stopPropagation();
    const files = event.target.files || event.dataTransfer.files;
    const file = files[0];

    const reader = new FileReader();
    reader.onload = (e) => {
      this.fileChange.emit(e.target.result);
    };
    reader.readAsBinaryString(file);
  }
}

const CUSTOM_VALUE_ACCESSOR = CONST_EXPR(new Provider(
  NG_VALUE_ACCESSOR, {
    useExisting: forwardRef(() => FileUploadValueAccessor),
    multi: true,
  }));

@Directive({
  selector: 'file-upload',
  host: {
    '(fileChange)': 'onChange($event)',
  },
  providers: [CUSTOM_VALUE_ACCESSOR],
})
export class FileUploadValueAccessor {
  static get parameters() {
    return [[FileUploadComponent]];
  }
  constructor(host) {
    this.host = host;
    this.onChange = () => {};
    this.onTouched = () => {};
  }

  writeValue(value) {
    this.host.setValue(value);
  }

  registerOnChange(fn) {
    this.onChange = fn;
  }
  registerOnTouched(fn) {
    this.onTouched = fn;
  }
}

Answer 1

我找到了解决方案，问题是我的输入错误“constructor”应该是“constructor”，因此没有定义输出文件更改。