Angular2 http post无法捕获控制器动作

时间:2017-01-31 08:07:06

标签: asp.net-mvc http angular asp.net-core

我想调用post asp net core controller action。

这是我的代码: 消息控制器

[Route("api/[controller]")]
public class MessageController : Controller
{
    [HttpPost]
    public IActionResult AddBlog(string email)
    {
        //test
        return View();
    }
}

我的表格:

<form [formGroup]="contactForm" (ngSubmit)="onSubmitModelBased()">
    <div class="form-group">
        <label for="email">Email</label>
        <input type="email" class="form-control" id="email" formControlName="email" placeholder="email">
    </div>
    <button type="submit" class="btn btn-block btn-primary">Wyślij</button>
</form>

和我的组件ts

public onSubmitModelBased() {
    alert("test");
    let body = JSON.stringify({ email: 'test@test.pl' });
    let headers = new Headers({ 'Content-Type': 'application/json' });
    this.http
        .post('/api/Message/AddBlog', body, { headers: headers })
        .subscribe(data => {
            alert('ok');
        }, error => {
            alert('not ok');
        });
}

I;看到警报(“测试”)和http.post动作返回警报('ok')。 我还在控制器动作中设置了一个断点,但它并没有被捕获。

1 个答案:

答案 0 :(得分:3)

您的路由应该是:

[Route("api/[controller]/[action]")]
public class MessageController : Controller
{
    [HttpPost]
    public IActionResult AddBlog([FromBody] AddBlogModel model)
    {
        //test
        return View();
    }
}

现在设置它的方式意味着当POST请求到达/ api / message时会触发操作。添加动作占位符使其可以按预期接受对/ api / message / addblog的POST请求。

编辑:至于你的另一个问题,你发送了一个JSON对象,但希望MVC能够解决它。您需要创建一个模型类,例如:

public class AddBlogModel
{
    public string Email { get; set; }
}

并按上述方式更改您的控制器操作。这将告诉MVC Core应该根据请求体创建模型,这是您的JSON。该模型包含一个包含电子邮件地址的属性。