大佬教程收集整理的这篇文章主要介绍了在Angular2 rc4中为输入类型=日期使用自定义ControlValueAccessor时格式化错误,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
对于值访问器进行了相当多的研究后,我决定专门为< input type = date />以避免在组件中要求单独的mule属性,只是将日期转换为输入的字符串.
我发现了this gist,这似乎做了很多我想做的事情.
使用它作为一个开始,几乎结束点,我想出了这一点:
import { Directive,ElementRef,Renderer,forwardRef } from "@angular/core"; import { ControlValueAccessor,NG_VALUE_ACCESSOR } from "@angular/forms"; import { isBlank,isDate } from "@angular/forms/src/facade/lang"; import moment from "moment"; export const DATE_VALUE_ACCESSOR: any = { provide: NG_VALUE_ACCESSOR,useExisting: forwardRef(() => DateValueAccessor),multi: true }; @Directive({ selector: "input[type=date][formControlName],input[type=date][formControl],input[type=date][ngModel]",host: { "(change)": "onChange($event.target.value)","(input)": "onChange($event.target.value)","(blur)": "onTouched()" },providers: [DATE_VALUE_ACCESSOR] }) export class DateValueAccessor implements ControlValueAccessor { onChange = (_: any) => { // we don't need to do anything here }; onTouched = () => { // we don't need to do anything here }; constructor( private _renderer: Renderer,private _elementRef: ElementRef) { } writeValue(value: any): void { var normalizedValue: string = isBlank(value) ? "" : (isDate(value) ? moment(value).format("YYYY-MM-DD") : ""); this._renderer.setElementProperty(this._elementRef.nativeElement,"value",normalizedValue); } registerOnChange(fn: (_: any) => void): void { this.onChange = (value: string) => { var date: moment.Moment = moment(value,"YYYY-MM-DD"); var newValue: Date = date.isValid() ? date.toDate() : undefined; fn(newValue); }; } registerOnTouched(fn: () => void): void { this.onTouched = fn; } }
我觉得我几乎在那里,但不完全相同!
更新当表单首次加载时,一切都是hunky dory,但是当我尝试选择一个新的日期时,浏览器会抱怨格式. /更新
我在devtools中可以看到的错误是:
我烧了一点时间调整代码并移动了一些东西.我也试图从onChange(as can be seen in this plnkr)里面调用writeValue,但是我仍然看到错误…
有没有人这样做?在我错过的代码中有什么明显的东西吗?
您代码的唯一更改是:
registerOnChange(fn: (_: any) => void): void { this.onChange = fn; }
这不是显示文本的不同,据我所知,绑定到输入type =“date”作为元素,不能被覆盖.快速搜索需要我到Is there any way to change input type=”date” format?这似乎回覆了这个说法.
以上是大佬教程为你收集整理的在Angular2 rc4中为输入类型=日期使用自定义ControlValueAccessor时格式化错误全部内容,希望文章能够帮你解决在Angular2 rc4中为输入类型=日期使用自定义ControlValueAccessor时格式化错误所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。