如何访问这formbuilder验证回调

Question

我使用表单生成器建立一个形式：

public searchMapForm = this.formBuilder.group({ 
    country: ["DE"], 
    postcode: ["13347", this.searchCont], 
    this: [this] 
}); 

的邮政编码自定义验证的样子：

private searchCont(c) { 

    if(!c || !c.value || c.value.length < 4) return { toShort: { valid: false } }; 

    var __this = c._parent && c._parent.controls.this.value; // this look too complicated 

    if(__this && __this.http) { 
     __this.http.get('http://nominatim.openstreetmap.org/search?format=json&addressdetails=1&limit=5&postalcode=' + c.value + '&countrycodes=' + c._parent.controls.country.value).subscribe(res => { 
      let l = res.json()[0]; 

      if(l) { 
       __this.map.setView([l.lat, l.lon], 13, { animate: true }) 
       __this.markers.map(m => { m.remove(); }) 
       __this.markers = []; 
       __this.markers.push(L.marker([l.lat, l.lon]).addTo(__this.map)); 
      } 
     }); 
    } 

    return null; 
} 

每次改变后，调用回调，但this未定义。所以我必须找到一种方法来访问它。一切正常，但不好看。在这种情况下最好的做法是什么？

Answer 1

我会把http请求调用放在form的valueChanges事件中。

searchMapForm.valueChanges.subscribe(e=>{ 
if(this.searchMapForm.controls['postcode'].valid && !this.searchMapForm.controls['postcode'].pristine){ 
this.http.get('http://nominatim.openstreetmap.org/search?format=json&addressdetails=1&limit=5&postalcode=' + e.postcode + '&countrycodes=' + e.country).subscribe(res => { 
      let l = res.json()[0]; 

      if(l) { 
       this.map.setView([l.lat, l.lon], 13, { animate: true }) 
       this.markers.map(m => { m.remove(); }) 
       this.markers = []; 
       this.markers.push(L.marker([l.lat, l.lon]).addTo(this.map)); 
      } 
     }); 
} 
}); 

，或者你可以想创建一个单独的指令，像本教程的here