Angular 2 form，获取方法is post

在Angular 2表单提交时，遇到问题。当我在组件中创建一个对象时，一切正常，我的表单通过post方法提交。但是，当我使用组件外的类中的对象时，我的表单使用url发送获取请求http://localhost:4200/blog?title=sss&content=ssssss Angular 2 form，获取方法is post

有没有人知道为什么会发生这种情况？

模板：

<form (ngSubmit)="onSubmit()" #f="ngForm"> 
    <!-- <form #f="ngForm" (ngSubmit)="onSubmit(f)">--> 
     <div class="form-group"> 
     <label for="title">Tytuł</label> 
     <textarea class="form-control" id="title" rows="1" 
        ngModel name = "title" required minlength="3" #title="ngModel"></textarea> 
     <span class="help-block" *ngIf="!title.valid && title.touched">Wprowadzono za krótki tekst (minum to 3 znaki).</span> 
     <label for="content">Zawartość:</label> 
     <textarea class="form-control" id="content" rows="3" 
        ngModel name = "content" required minlength="3" #content="ngModel"></textarea> 
     <span class="help-block" *ngIf="!content.valid && content.touched">Wprowadzono za krótki tekst (minum to 3 znaki).</span> 
     </div> 
     <button type="submit" class="btn btn-primary" 
       [disabled] ="!f.valid" 
     >Wyślij</button> 
    </form>

组件：

import {Component, OnInit, ViewChild} from '@angular/core'; 
import {NgForm} from "@angular/forms"; 
import {Blog} from "../../shared/blog"; 
import {BlogService} from "../../services/blog.service"; 

@Component({ 
    selector: 'app-blog-form', 
    templateUrl: './blog-form.component.html', 
    styleUrls: ['./blog-form.component.css'] 
}) 
export class BlogFormComponent implements OnInit { 

    @ViewChild('f') form: NgForm; 
    errorMessage: string; 
/* this works well 
blog = { 
    title: '', 
    content: '', 
    dateCreated: '' 
    }*/ 

//this doesn't work 
blog: Blog; 

    ngOnInit(){} 

    onSubmit(){ 
    this.blog.title = this.form.value.title; 
    this.blog.content = this.form.value.content; 
    } 
}

博客类中。我都尝试这样的：

export class Blog { 
    constructor(public title = '', public content = '', public dateCreated = ''){}}

这：

export class Blog { 
    constructor(public title : string, public content : string, public dateCreated : string){}}

感谢所有帮助:)

来源

2017-07-26 angie

你能提供你创建的服务吗？ –

我没有使用该服务。这只是旧的进口 – angie

问题仍然存在，如果我删除导入 – angie

我不知道为什么会这样，但尽量不要使用this.form.value。

onSubmit(){ 
    this.blog.title = this.form.title; 
    this.blog.content = this.form.content; 
    console.log(this.blog); 
}

使用有价值的帖子支持您的页面。现在这个代码应该工作。

来源

2017-07-26 11:58:57

我得到一个错误比：属性'标题'不存在类型'NgForm' – angie

Angular 2 form，获取方法is post

回答

相关问题