为什么我不能将价值绑定到我的自定义指令？

我创建了一个自定义的指令，以验证在表单我输入：为什么我不能将价值绑定到我的自定义指令？

import { Directive, Attribute, Input } from '@angular/core'; 
import { Validator, ValidatorFn, AbstractControl, NG_VALIDATORS } from '@angular/forms'; 

function isEmptyInputValue(value: any): boolean { 
    // we don't check for string here so it also works with arrays 
    return value == null || value.length === 0; 
} 

@Directive({ 
    selector: '[minNumber][ngModel], [minNumber][formControll]', 
    providers: [{provide: NG_VALIDATORS, useExisting: MinNumberValidatorDirective, multi: true}] 
}) 
export class MinNumberValidatorDirective implements Validator { 

    constructor(@Attribute('minNumber') public minNumber: number) { } 

    validate(control: AbstractControl): {[key: string]: any} { 
     if (isEmptyInputValue(control.value) || isEmptyInputValue(this.minNumber)) { 
     return null; 
     } 
     const value = parseFloat(control.value); 
     return !isNaN(value) && value < this.minNumber ? {'minNumber': {'minNumber': this.minNumber, 'actual': control.value}} : null; 
    } 
}

如果我传递任何值，而不绑定到我的自定义指令，它工作正常，但是当我用招投标，这引发以下错误：

Uncaught Error: Template parse errors: Can't bind to 'minNumber' since it isn't a known property of 'input'.

这里是我用我的自定义指令：

<input type="number" class="form-control" id="lun-size" name="lun-size" 
    [(ngModel)]="virtualDrive.si 
    minNumber="{{ minSize }}" 
    max="15" 
    ngControl="size" 
    required>

任何人都可以帮我解决这个问题呢？

来源

2017-06-22 Natanael

因为'minNumber'属性绑定 – yurzui

您应该使用'@ Input'来写入'minNumber =“12”''，属性绑定仅适用于静态添加的值，而不适用于绑定值。 'minNumber =“12345”'会起作用。 –

你试过

@Input() 
minNumber: number;

，而不是使用构造？

另外...我注意到，当你有一个像这样的验证器需要输入时，你必须跳过好几圈才能在minNumber更改时重新运行验证。看看MaxLengthValidator了解如何继续下去。

来源

2017-06-22 20:05:45 fringd

@Input（）是我忘记了教程的基本资源，谢谢。构造函数上的@Attribute是@Input的替代吗？ – Natanael

为什么我不能将价值绑定到我的自定义指令？

回答

相关问题