Question

角度模板变量＆amp; NgModel指令变量

感谢Angular团队带来如此惊人的框架。自2014年以来，我一直在研究AngularJS。完全喜欢Angular家族。

到目前为止，我正在研究Angular模板驱动的表单。请查看以下详细信息。

＆＃13;

<input type="text" id="input1" name="input1" #input1 [(ngModel)]="data.name" minlength="10">

<input type="text" id="input2" name="input2" #input2="ngModel"  [(ngModel)]="data.name" minlength="10">

<op-single-error-message [field]="input1" [formField]="input2"></op-single-error-message>

＆＃13;

input1是模板变量。
input2是 NgModel指令变量。
op-single-error-message是一个包含两个@inputs的组件。

单错message.component.ts

＆＃13;

import { Component, OnInit, Input } from '@angular/core';
import { NgForm, NgModel } from '@angular/forms';

@Component({
    moduleId: module.id,
    selector: 'op-single-error-message',
    templateUrl: './single-error-message.component.html'
})
export class SingleErrorMessageComponent implements OnInit {
    @Input() form: NgForm;
    @Input() field: any;		// Binds to #input1
    @Input() formField: NgModel;	// Binds to #input2
    @Input() labelTitle: string;

    constructor() { }

    ngOnInit(): void {
    	console.log(`Input1 minlength: ${field.minlength}`);
        console.log(`Input2 minlength: ${formField.minlength}`);		// I KNOW THIS DOES NOT WORK
    }
}

＆＃13;

单错message.component.html

＆＃13;

<span class="help-block" *ngIf="formField.invalid && (form.submitted || formField.dirty || formField.touched)">
    <small class="text-danger" *ngIf="formField.errors.required">{{labelTitle}} is required.</small>
    <small class="text-danger" *ngIf="formField.errors.minlength">{{labelTitle}} is must be at least {{?}} characters long.</small>
</span>

＆＃13;

我想显示此组件中包含的不同类型的错误消息。在这种情况下，如果用户想要更改所有必需的输入，并且错误消息来自＆＃39; xxx则需要＆＃39;到＆＃39; xx不能为空＆＃39;，这将是一种简单的处理方式。

我的问题

SingleErrorMessageComponent中的formField是一个NgModel变量。有没有什么方法可以让DOM像“＆＃39; field＆＃39;呢？因为我想这样做： - 获取DOM属性值 - 添加/删除属性

任何帮助都会被批评。提前谢谢。

角度模板变量＆amp; NgModel指令变量

角度模板变量＆amp; NgModel指令变量

0 个答案: