我在Angular 2.0(
)中创建了一个自定义元素,当我在组件上包含ngModel属性时,我立即遇到以下错误:
EXCEPTION: No value accessor for '' in [myModel in App@0:195]
这是一个吸烟者:http://plnkr.co/edit/wlkPWcB92YZASCwCnmcw?p =preview
(打开控制台查看错误)
如果您只是注释掉以下行src/app.ts
,则组件将正确呈现:
'[ngModel]="myModel"'
我做了以下事情:
进口{FORM_DIRECTIVES}
自'angular2/common'
包含FORM_DIRECTIVES
在directives
部分内容中@Component
初始化 myModel
我在这里错过了什么?
我认为你应该使用别的东西而不是组件ngModel
的参数my-select
...因为它已经被Angular2使用了.
我试了一下,model
似乎更好......我没有错误了.
编辑
如果要在my-select
组件级别处理ngModel ,可以查看以下链接:https://github.com/angular/angular/issues/2543.
如果要实现符合ngModel的组件,可以查看以下链接:
http://restlet.com/blog/2016/02/17/implementing-angular2-forms-beyond-basics-part-2/.请参阅:与NgModel兼容的组件部分
Angular 2自定义表单输入
希望它对你有帮助,蒂埃里
我有两个原因:
1)组件必须将自身附加为值访问器,如:
@Component({ selector: 'ace-editor', template: ``, }) export class AceEditor implements OnInit, ControlValueAccessor { constructor(private element: ElementRef, @Optional() ngControl: NgControl) { if (ngControl) { ngControl.valueAccessor = this; } }
2)您不得混用已弃用和新表格.如果您使用新的API添加到您的main.ts
:
import { bootstrap } from '@angular/platform-browser-dynamic'; import { disableDeprecatedForms, provideForms } from '@angular/forms'; import { AppComponent } from './app.component'; bootstrap(AppComponent, [ disableDeprecatedForms(), provideForms() ]) .catch((err: any) => console.error(err));