javascript - 异常 : No provider for Angular 2 custom form input

Question

我正在尝试实现

ControlValueAccessor

对于自定义 Angular 2 表单输入

我遇到了异常

EXCEPTION: No provider for MyDatePicker! (MyDatePickerValueAccessor -> MyDatePicker)

我将代码上传到 Plunker

Plunker Custom Control Event Binding Working

Plunker Custom Control Value Accessor Not Working

还有我的 ControlValueAccessor 实现

    import {MyDatePicker} from './MyDatePicker';
    import { Directive, Provider, forwardRef , } from 'angular2/core';
    import {ControlValueAccessor, NG_VALUE_ACCESSOR} from 'angular2/common';
    import {CONST_EXPR} from 'angular2/src/facade/lang';

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

    @Directive({
        selector: 'my-date-picker',
        host: { '(dateChanged)': 'onChange($event)' },
        providers: [CUSTOM_VALUE_ACCESSOR]
    })
    export class MyDatePickerValueAccessor implements ControlValueAccessor {
        onChange = (_) => { };
        onTouched = () => { };

        constructor(private host: MyDatePicker) { }

        writeValue(value: any): void {
            this.host.selDate = value;
        }

        registerOnChange(fn: (_: any) => void): void { this.onChange = fn; }
        registerOnTouched(fn: () => void): void { this.onTouched = fn; }
    }

这里是我研究的一些链接:

• > typescript - Angular 2 custom form input - Stack Overflow
• > forms - Angular2 - Radio Button Binding - Stack Overflow
• > ControlValueAccessor - ts
• > Forms - ts
• > Implementing Angular2 forms – Beyond basics (part 2) | Restlet - We Know About APIs
• > ng2-ckeditor/CKEditor.d.ts at 6699185310a5d50776b541ae7a2ae5cb55e4394a · chymz/ng2-ckeditor
• > restlet-sample-angular2-forms/company.details.ts at master · restlet/restlet-sample-angular2-forms
• > angular/control_value_accessor.ts at 2.0.0-beta.9 · angular/angular

Answer 1

试着写

providers: [CUSTOM_VALUE_ACCESSOR, MyDatePicker]