直接从FormGroup中的输入FormControl而不是FormControl订阅valueChanges

时间:2018-03-21 13:11:03

标签: angular

我在component.ts文件中有以下“工作”代码(我也包含了html代码)

请查看代码中3个位置的注释行。当我直接使用FormControl变量时,valueChanges属性工作正常,但是当我从FormGroup访问FormControl变量时,我得到"ERROR Error: Cannot find control with unspecified name attribute"

我在这里做错了什么?

app.component.ts中的代码:

import { Component } from '@angular/core';

import {FormControl, FormGroup} from '@angular/forms';
import 'rxjs/add/operator/debounceTime';

@Component({
  selector: "app-root",
  template: `
    <!--<form [formGroup]="searchFormGroup" >-->
       <h2>Observable events from formcontrol</h2>
      <input type="text" placeholder="Enter input" [formControl]="searchInput">
    <!--</form>-->
    `
})
export class AppComponent {

  //searchFormGroup = new FormGroup({searchInput: new FormControl('')});
  searchInput: FormControl = new FormControl('');

  constructor(){

    //this.searchFormGroup.get('searchInput').valueChanges
    this.searchInput.valueChanges
      .debounceTime(500)
      .subscribe(input => console.log(input));
  }
}

由于

3 个答案:

答案 0 :(得分:0)

因为您没有像这样构建表单组。以下是如何构建它。

constructor(private fb: FormBuilder) {
  this.searchFormGroup = fb.group({
    searchInput: ['']
  });
}

答案 1 :(得分:0)

在html代码中使用formControlName之后开始正常工作:

import { Component } from '@angular/core';

import {FormControl, FormGroup} from '@angular/forms';
import 'rxjs/add/operator/debounceTime';

@Component({
  selector: "app-root",
  template: `
    <form [formGroup]="searchFormGroup" >
       <h2>Observable events from formcontrol</h2>
      <input type="text" placeholder="Enter input" formControlName="searchInput">
    </form>
    `
})
export class AppComponent {

  searchFormGroup = new FormGroup({'searchInput': new FormControl('')});
  //searchInput: FormControl = new FormControl('');

  constructor(){

    this.searchFormGroup.get('searchInput').valueChanges
    //this.searchInput.valueChanges
      .debounceTime(500)
      .subscribe(input => console.log(input));
  }
}

答案 2 :(得分:0)

它无法在RXjs 6.0中运行,以下是使用 public string GetVisitorIPAddress(bool GetLan = false) { string visitorIPAddress = System.Web.HttpContext.Current.Request.ServerVariables["HTTP_X_FORWARDED_FOR"]; if (String.IsNullOrEmpty(visitorIPAddress)) visitorIPAddress = System.Web.HttpContext.Current.Request.ServerVariables["REMOTE_ADDR"]; if (string.IsNullOrEmpty(visitorIPAddress)) visitorIPAddress = System.Web.HttpContext.Current.Request.UserHostAddress; if (string.IsNullOrEmpty(visitorIPAddress) || visitorIPAddress.Trim() == "::1") { GetLan = true; visitorIPAddress = string.Empty; } if (GetLan) { if (string.IsNullOrEmpty(visitorIPAddress)) { //This is for Local(LAN) Connected ID Address string stringHostName = Dns.GetHostName(); //Get Ip Host Entry IPHostEntry ipHostEntries = Dns.GetHostEntry(stringHostName); //Get Ip Address From The Ip Host Entry Address List IPAddress[] arrIpAddress = ipHostEntries.AddressList; try { visitorIPAddress = arrIpAddress[arrIpAddress.Length - 2].ToString(); } catch { try { visitorIPAddress = arrIpAddress[0].ToString(); } catch { try { arrIpAddress = Dns.GetHostAddresses(stringHostName); visitorIPAddress = arrIpAddress[0].ToString(); } catch { visitorIPAddress = "127.0.0.1"; } } } } } var zaz = ""; zaz = visitorIPAddress.ToString(); getcityname(zaz); return null; }

编写它的方法
Formcontrol