Angular 2 |如何在提交表格時設置大寫

我嘗試使用.toUpperCase（）方法，但它不工作。是他們的一些形式驗證自動大寫的值提交表單時？

這是我的下面的代碼。

component.html

<div class="form-group input-holder"> 
    <label class="col-lg-2">Description</label> 
    <div class="col-lg-4"> 
     <small [ngClass]="{'prompterror': storageForm.controls.description.valid || storageForm.controls.description.pristine}"> 
     *required 
     </small> 
     <input type="text" class="input-field" placeholder="Description" formControlName="description" ngModel> 
    </div> 
</div>

component.ts文件

import { Component, OnInit, OnDestroy, ViewChild } from '@angular/core'; 
import { FormGroup, FormControl, Validators } from '@angular/forms'; 
import { Subscription } from 'rxjs/Subscription'; 

import { Storage } from '../shared/storage.model'; 
import { StorageEntryService } from '../storage.service'; 

@Component({ 
    selector: 'app-storageentry', 
    templateUrl: './storageentry.component.html', 
    styleUrls: ['./storageentry.component.css'], 
}) 
export class StorageentryComponent implements OnInit, OnDestroy { 

    storageForm: FormGroup; 

    constructor(private storageEntryService: StorageEntryService) {} 

    private initForm() { 
     let storageDescription = ''; 

     if (this.editButton) { 
      const storage = this.storageEntryService.getStorage(this.storageId) 
      storageDescription = storage.description; 
     } 

     this.storageForm = new FormGroup({ 
      'description': new FormControl(storageDescription, Validators.required) 
     }) 
    } 
}

提交功能

onSubmit(){ 
// Switching for Add Button and Edit Button 
if (this.editButton) { 
    this.storageEntryService.updateStorage(this.storageIdIndex, this.storageForm.value); 
    this.editButton = false; 
}else{ 
    this.storageEntryService.addStorage(this.storageForm.value); 
} 
this.storageForm.reset();

}

來源

2017-07-15 Jydon Mah

，但它應該是可見他在大寫??? – mayur

我沒有看到提交的任何代碼，另一方面initForm（）的用途是什麼，從未使用過。 – Vega

單擊編輯按鈕時，初始化initForm（）。這是爲了編輯的目的。虐待更新我的代碼 –

創建一個指令來處理這種情況

<input type="text" change />

指令必須具備以下keyup事件處理

LIVE DEMO

要允許用戶輸入小字符

來源

2017-07-16 08:55:43 Aravind

上調用了initForm（），感謝這個aravind。它工作正常:) :) –

請注意。 – Aravind

Angular 2 |如何在提交表格時設置大寫

回答

相關問題