Question

我正在尝试使用Polymer cycler (0.10.0) distribute (0.7.3) matplotlib (1.5.1) numpy (1.11.0) pip (8.1.2) pyparsing (2.1.4) python-dateutil (2.5.3) pytz (2016.4) setuptools (21.1.0) six (1.10.0) wheel (0.29.0)控件在Angular2中创建一个表单。有没有办法将下拉列表的选定值绑定到组件中的控件？我没有运气就尝试了一切。有没有人克服这个障碍？

工作paper-dropdown-menu的一个例子是：

模板：

paper-input

成分：

<paper-input type="password"
             ngControl="password"
             ngDefaultControl>
</paper-input>

constructor(private fb:FormBuilder) { this.loginForm = fb.group({ password: new Control("") }); }是否有类似内容？绑定到值或文本本身都可以。谢谢！

Answer 1

您需要自定义ControlValueAccessor。我没有成功使用ControlValueAccessor paper-dropdown-menu本身，而是使用paper-menu或paper-listbox内的paper-dropdown-menu

const PAPER_MENU_VALUE_ACCESSOR = new Provider(
    NG_VALUE_ACCESSOR, {useExisting: forwardRef(() => PaperMenuControlValueAccessor), multi: true});


@Directive({
  selector: 'paper-listbox',
  host: {'(iron-activate)': 'onChange($event.detail.selected)'},
  providers: [PAPER_MENU_VALUE_ACCESSOR]

})  
export class PaperMenuControlValueAccessor implements ControlValueAccessor {
  onChange = (_:any) => {
  };
  onTouched = () => {
  };

  constructor(private _renderer:Renderer, private _elementRef:ElementRef) {
    console.log('PaperMenuControlValueAccessor');
  }

  writeValue(value:any):void {
    //console.log('writeValue', value);
    this._renderer.setElementProperty(this._elementRef.nativeElement, 'selected', value);
  }

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

  registerOnTouched(fn:() => {}):void {
    this.onTouched = fn;
  }
}

另见

可以使用ngControl绑定Polymer纸张下拉菜单吗？

1 个答案: