如何使用腳本類型

目前我正在學習使用驗證部分angular2做在angular2客戶文本字段驗證，我無法驗證簡單的客戶文本框字段如何使用腳本類型

這是我的HTML代碼

<div class="col-xs-12 col-sm-12 col-md-6 col-lg-6 padding-lft-rght-0"> 
         <div class="form-control setup-form margin-btm"> 
          <label test_id="lblcustname" class="control-label col-xs-12 col-sm-4 col-md-4 col-lg-3" for=""> 
           {{ 'CUSTOMER.CNAME' | translate }} <span class="mandatory">*</span> 
          </label> 
          <div class="col-xs-12 col-sm-8 col-md-8 col-lg-8 padding-left-0"> 
           <input type="text" id="txtName" class="form-control" required maxlength="100" name="CustomerName" [(ngModel)]="customerObj.CustomerName" (ngModelChange)="checkCustomeName($event)" /> 
          </div> 
         </div> 
        </div>

和我下面的打字稿代碼

checkCustomeName(event) { 

     if (event === "") { 
      this.isCustomerNameEmpty = false; 
     } 
     else { 
      var textbox= document.getElementById('txtName'); 
      if (textbox.nodeValue.length > 100) 
      { 
       this.isCustomerNameexceed = false; 
      } 
      this.isCustomerNameexceed = true; 


     } 
    }

所以每當我使用鉻調試我不能夠在下面一行的得到任何價值..

var textbox= document.getElementById('txtName');

所以這是在打字稿中進行驗證的正確方法。

來源

2017-04-26 Sami Parkar

這是'angularjs' - 角v1或'angular' - 角V2 +？ – DeborahK

我覺得你只得到與

var textbox = document.getElementById('txtName');

元素嘗試

var textbox = document.getElementById('txtName').value;

更重要的是，由於您使用數據綁定，你應該能夠使用

var textbox = customerObj.CustomerName; 
if (textbox.length > 100) ...

如果您想要使用Angular方法，請查看錶單驗證in the angular docs

來源

2017-04-26 17:45:21 Michael

首先您必須考慮。這個模板：

<input [(ngModel)]="some"/>

是一樣的：

<input [ngModel]="some" (ngModelChange)="some = $event">

有

<input [(ngModel)]="some" (ngModelChange)="someHandler($event)">

是壞主意。

基本上，有「Angular2方式」做驗證https://angular.io/docs/ts/latest/cookbook/form-validation.html，但是無論如何。

另一件事：你不需要參考txtField來獲得價值。

checkCustomeName(event) - 其中event是您的價值。
如果你想跟蹤一些範圍變量的變化，再做一次「Angular2方式」與ngOnChanges()生命週期掛鉤https://angular.io/docs/ts/latest/guide/lifecycle-hooks.html

來源

2017-04-26 18:21:10

如何使用腳本類型

回答

相關問題