typescript 如何访问 ts 组件中的表单值 - angular 6
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/51264619/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
how to access form value in ts component - angular 6
提问by Adeel
I know so many answer are available but I install angular 6 version now form value is not submitted!
I add console screen shot blow
any one tell me where I am wrong.
HTML
我知道有很多答案可用,但我现在安装了 angular 6 版本,但未提交表单值!我添加控制台屏幕截图吹任何人告诉我我错在哪里。
HTML
<div class="container">
<div class="row">
<form (ngSubmit)="onSubmit(f)" #f="ngForm" class="jumbotron">
<input class="form-control" type="text" name="fName" ngModel>
<input class="form-control" type="text" name="lName" ngModel>
<button type="submit" class="btn btn-primary">Add</button>
</form>
</div>
</div>
TS component
TS组件
import { Component } from '@angular/core';
import { NgForm } from '@angular/forms';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
arr: any[]=[];
onSubmit(form : NgForm) {
this.arr = form.value
console.log('array', this.arr);
console.log('value', form.value);
}
}
回答by Lulutho Mgwali
To see the values of the objects you can json prettifier it like so:
要查看对象的值,您可以像这样使用 json 修饰符:
onSubmit(form:NgForm ) {
this.arr = form.value;
console.log(JSON.stringify( this.arr));
console.log(JSON.stringify( form.value));
}
This will take a JSON object string and return it pretty-printed/formatted
这将采用 JSON 对象字符串并以漂亮的打印/格式返回它