2017-05-05 164 views
1

我有四個需要在後端驗證的輸入字段。所以我寫了一個服務調用和基於輸出我需要添加類到輸入字段。所以如果確定,那麼綠色其他紅色。Angular2 Click方法總是返回假值

我想爲所有後端的驗證使用相同的方法。所以我試圖從點擊函數返回布爾值,但它總是返回false。這裏是我的代碼: -

<div class="row"><div class="col-md-2 col-md-offset-2 nopadding"><div class="form-group pull-right"><label>Query1:</label></div></div><div class="col-md-4 col-md-offset-0"><div class="form-group input-group"><input type="text" [ngClass]="{red: !(query1ok),green: (query1ok)}" class="form-control" name="query1" id="query1" [(ngModel)]="sampledetails.rules[0].query1"><span class="input-group-btn"><a href="javascript:void(0)" class="btn btn-default" alt="validate query" (click)="[query1ok]:validateQuery(query1ok,sampledetails.rules[0].query1)" type="button"><i class="fa fa-play"></i></a></span></div></div></div> <div class="row"><div class="col-md-2 col-md-offset-2 nopadding"><div class="form-group pull-right"><label>Query2:</label></div></div><div class="col-md-4 col-md-offset-0"><div class="form-group input-group"><input type="text" [ngClass]="{red: !(query2ok),green: (query2ok)}" class="form-control" name="query2" id="query2" [(ngModel)]="sampledetails.rules[0].query2"><span class="input-group-btn"><a href="javascript:void(0)" class="btn btn-default" alt="validate query" (click)="validateQuery(query2ok,samplerdetails.rules[0].query2)" type="button"><i class="fa fa-play"></i></a></span></div></div></div><div class="row"><div class="col-md-2 col-md-offset-2 nopadding"><div class="form-group pull-right"><label>Query3:</label></div></div><div class="col-md-4 col-md-offset-0"><div class="form-group input-group"><input type="text" [ngClass]="{red: !(query3ok),green: (query3ok)}" class="form-control" name="query3" id="query3" [(ngModel)]="samplerdetails.rules[0].query3"><span class="input-group-btn"><a href="javascript:void(0)" class="btn btn-default" alt="validate query" (click)="validateQuery(query3ok,ssampledetails.rules[0].query3)" type="button"><i class="fa fa-play"></i></a></span></div></div></div><div class="row"><div class="col-md-2 col-md-offset-2 nopadding"><div class="form-group pull-right"><label>Query4:</label></div></div><div class="col-md-4 col-md-offset-0"><div class="form-group input-group"><input type="text" [ngClass]="{red: !(query4ok),green: (query4ok)}" class="form-control" name="query4" id="query4" [(ngModel)]="samplerdetails.rules[0].query4"><span class="input-group-btn"><a href="javascript:void(0)" class="btn btn-default" alt="validate query" (click)="validateQuery(query4ok,sampledetails.rules[0].query4)" type="button"><i class="fa fa-play"></i></a></span></div></div></div> 


validateQuery(querystatus, query){ 
    this._validatorService.validateQuery(query).subscribe(
      (data) => { 
       return false; 
      }, 
      (err) =>{ 
      return true; 
      } 
     ); 
    } 

所以想知道,如果它能夠在angular2,如果是從返回點擊功能布爾值,然後怎麼樣?

回答

1

你應該返還認購數據如下

validateQuery(querystatus, query){ 
    this._validatorService.validateQuery(query).subscribe(
      (data) => { 
       return data;////////////////////////// 
      }, 
      (err) =>{ 
      return true; 
      } 
     ); 
    } 

更新在HTML 1

validateQuery(querystatus, query){ 
    this._validatorService.validateQuery(query).subscribe(
      (data) => { 
       this.queryok= false; 
      }, 
      (err) =>{ 
       this.queryok= true; 
      } 
     ); 
    } 

你的函數調用將作爲

(click)="validateQuery(query1ok,sampledetails.rules[0].query1)" 
+0

我試過這樣。同樣的錯誤。當它返回布爾型的錯誤數據時,我想返回false。我的數據是真實的,但仍然在點擊方法中出現錯誤。只是想檢查我是否正確地分配了返回值?這裏是我的代碼: - **'(click)=「query1ok = validateQuery(query1ok,sampledetails.rules [0] .query1)」** – NJin

+0

是否可以在團隊查看器中使用? 'query1ok'是什麼意思? – Aravind

+0

抱歉無法訪問團隊查看器。 query1ok是我在我的類中聲明的一個變量,如** query1ok:boolean = true; **和它用於ngClass中的條件的相同變量 – NJin