igxInput ディレクティブは、単一または複数行のテキスト要素を作成し、フォーム入力を扱うときの一般的なシナリオに対処します。
igxInput
IgxInputGroupModule
データ入力 & 表示
igx-input-group-theme
input, input group, form, field, validation
プレゼンテーション
<input-group> <label for="address">Address</label> <input igxInput name="address" type="text" [(ngModel)]="customer.address"></input-group> Copy
<input-group> <label for="address">Address</label> <input igxInput name="address" type="text" [(ngModel)]="customer.address"></input-group>
"igx-input-group__input" クラスがホスト要素に追加されるかどうかを取得または設定します。 デフォルト値は false です。
"igx-input-group__input"
false
this.igxInput.isInput = true; Copy
this.igxInput.isInput = true;
let isCLassAdded = this.igxInput.isInput; Copy
let isCLassAdded = this.igxInput.isInput;
"class.igx-input-group__textarea" クラスがホスト要素に追加されるかどうかを取得または設定します。 デフォルト値は false です。
"class.igx-input-group__textarea"
this.igxInput.isTextArea = true; Copy
this.igxInput.isTextArea = true;
let isCLassAdded = this.igxInput.isTextArea; Copy
let isCLassAdded = this.igxInput.isTextArea;
disabled プロパティを取得します。
disabled
@ViewChild('igxInput', {read: IgxInputDirective}) public igxInput: IgxInputDirective;let isDisabled = this.igxInput.disabled; Copy
@ViewChild('igxInput', {read: IgxInputDirective}) public igxInput: IgxInputDirective;let isDisabled = this.igxInput.disabled;
disabled プロパティを設定します。
<input-group> <input igxInput #igxInput [disabled]="true"></input-group> Copy
<input-group> <input igxInput #igxInput [disabled]="true"></input-group>
igxInput がフォーカスされるかどうかを取得します。
let isFocused = this.igxInput.focused; Copy
let isFocused = this.igxInput.focused;
igxInput にプレースホルダーがあるかどうかを取得します。
let hasPlaceholder = this.igxInput.hasPlaceholder; Copy
let hasPlaceholder = this.igxInput.hasPlaceholder;
igxInput が有効かどうかを取得します。
let valid = this.igxInput.isValid; Copy
let valid = this.igxInput.isValid;
igxInput のnativeElement を取得します。
nativeElement
let igxInputNativeElement = this.igxInput.nativeElement; Copy
let igxInputNativeElement = this.igxInput.nativeElement;
igxInput のプレースホルダー要素を取得します。
let igxInputPlaceholder = this.igxInput.placeholder; Copy
let igxInputPlaceholder = this.igxInput.placeholder;
igxInput が必須かどうかを取得します。
let isRequired = this.igxInput.required; Copy
let isRequired = this.igxInput.required;
required プロパティを設定します。
required
<input-group> <input igxInput #igxInput required></input-group> Copy
<input-group> <input igxInput #igxInput required></input-group>
igxInput の状態を取得します。
let igxInputState = this.igxInput.valid; Copy
let igxInputState = this.igxInput.valid;
igxInput の状態を設定します。
this.igxInput.valid = IgxInputState.INVALID; Copy
this.igxInput.valid = IgxInputState.INVALID;
value プロパティを取得します。
value
@ViewChild('igxInput', {read: IgxInputDirective}) public igxInput: IgxInputDirective;let inputValue = this.igxInput.value; Copy
@ViewChild('igxInput', {read: IgxInputDirective}) public igxInput: IgxInputDirective;let inputValue = this.igxInput.value;
value プロパティを設定します。
<input-group> <input igxInput #igxInput [value]="'IgxInput Value'"></input-group> Copy
<input-group> <input igxInput #igxInput [value]="'IgxInput Value'"></input-group>
igxInput にフォーカスを設定します。
this.igxInput.focus(); Copy
this.igxInput.focus();
igxInput
ディレクティブは、単一または複数行のテキスト要素を作成し、フォーム入力を扱うときの一般的なシナリオに対処します。Igx Module
IgxInputGroupModule
Igx Parent
データ入力 & 表示
Igx Theme
igx-input-group-theme
Igx Keywords
input, input group, form, field, validation
Igx Group
プレゼンテーション
例