Question

我是Angular 2的初学者，我正在尝试在组件中获取文本框的值，而我真的不知道如何获取它。

HTML：

import websocket
from json import dumps, loads
try:
    import thread
except ImportError:
    import _thread as thread

def on_message(ws, message):
    parsed_msg = loads(message)
    print(parsed_msg["product_id"], parsed_msg["price"])

def on_open(ws):
    def run(*args):
        params = {
            "type": "subscribe",
            "channels": [{"name": "ticker", "product_ids": ["BTC-USD", "ETH-USD"]}]
        }
        ws.send(dumps(params))
    thread.start_new_thread(run, ())

if __name__ == "__main__":
    websocket.enableTrace(True)
    ws = websocket.WebSocketApp("wss://ws-feed.gdax.com", on_open=on_open, on_message = on_message)
    ws.run_forever()

component.ts：

<form [formGroup]="regForm" >
                <label for="txtFName">First Name</label>
                <input type="text" id="txtFName"/>
</form>

这里我在控制台中获得空值。请帮助这方面

Answer 1

将formControlName添加到输入

<input type="text" id="txtFName" formControlName="firstName" />

现在按名称访问值

this.regForm.get('firstName').value

Answer 2

在以下控制下，命名为电子邮件：

ngOnInit() {
    this.contactForm = this.formBuilder.group({
      email: [null, Validators.compose([Validators.required])]
    });
  }

通过您授予控件的name进行访问：

this.formGroup.controls['email'].value

Answer 3

import { Component, OnInit } from '@angular/core';
import { FormBuilder, Validators } from '@angular/forms';


@Component({
  selector: 'demo-app',
  templateUrl: 'app/app.component.html'
})

export class regComponent implements OnInit {

private regForm:any;
    constructor(private formBuilder: FormBuilder) { 
    }
    ngOnInit(){
        this.regForm=formBuilder.group({
          firstName:['', Validators.required]
         })
    }

     saveUser() {
        if (this.regForm.dirty && this.regForm.valid) {
          alert(`FirstName: ${this.regForm.value.firstName}`);
        }
      }
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<form [formGroup]="regForm" (submit)="saveUser()" >
          <label for="txtFName">First Name</label>
          <input type="text" id="txtFName"  formControlName="firstName" #firstName="ngControl"/>
          <button type="submit" [disabled]="!userForm.valid">Submit</button>
        </form>

如何在控制器中读取表单值？

3 个答案: