简体   繁体   English

在Angular / .NET MVC中发出发布请求后,如何使用模型重定向?

[英]How to redirect with a model after making a post request in Angular/.NET MVC?

I am using .NET MVC and AngularJS. 我正在使用.NET MVC和AngularJS。 After making a post request to place an order, I need to return the order that was created to a different view. 发出下达订单的发布请求后,我需要将创建的订单返回到其他视图。

I have two views. 我有两种看法。 Purchase Success and Purchase Fail. 购买成功和购买失败。 Here is the post request in Angular: 这是Angular中的发布请求:

$http.post('/Home/PlaceOrder/', placeOrderViewModel)
                .then(function (response) {
                    if (response != null) {
                        window.location = '/Home/PurchaseSuccess';
                    } else {
                        window.location = '/Home/PurchaseFail';
                    }
                }, function () {
                    alert('error');
                });

Here is the method on my MVC controller. 这是我的MVC控制器上的方法。

public ActionResult PlaceOrder(PlaceOrderViewModel viewModel)
{

}

It accepts a view model from the Angular post request, and does some work. 它接受来自Angular发布请求的视图模型,并执行一些工作。 Then I have it returning either the purchase success or purchase fail view with the order model attached to a successful order. 然后,我将返回购买成功或购买失败视图,并将订单模型附加到成功订单上。

return View("~/Views/Home/PurchaseSuccess.cshtml", order);

return View("~/Views/Home/PurchaseFail.cshtml");

Returning the view does not work. 返回视图不起作用。 MVC does not seem to be able to handle the change in views since the request was made from Angular? 自从Angular发出请求以来,MVC似乎无法处理视图更改? The redirect in the Angular success handler is already working, and works great when you do not have a model being returned. Angular成功处理程序中的重定向已在起作用,并且当您没有返回模型时,重定向效果很好。

I basically just need to be able to redirect to the purchase success view with the model. 我基本上只需要能够使用模型重定向到购买成功视图。

Thank you for your time! 感谢您的时间!

EDIT: Here is the purchase success and purchase fail controller methods: 编辑:这是购买成功和购买失败控制器方法:

public ActionResult PurchaseSuccess()
        {
            return View();
        }

        public ActionResult PurchaseFail()
        {
            return View();
        }

When you use Angular to make a request, you are making an Ajax request where the intention is to get some data from server side without leaving the current page. 当您使用Angular发出请求时,您正在发出Ajax请求,其目的是在不离开当前页面的情况下从服务器端获取一些数据。

If you do want to go to another page, it's probably better just use a normal form with a submit button and an action attribute pointing to the page you want to redirect to. 如果确实要转到另一个页面,则最好使用带有提交按钮和指向要重定向到的页面的action属性的普通表单。 Like: 喜欢:

<form action="newPageUrl" method="post"> 
    ... // more inputs that carry the data you want to send to server side
    <input type="submit">
</form>

However, when people use Angular, it is more often that they just let Angular do the routing/rendering. 但是,当人们使用Angular时,通常他们只是让Angular进行路由/渲染。 That means you put your PurchaseSuccess.cshtml and PurchaseFail.cshtml on the client side as view templates and let client side render it: You make a post request to submit the order, server receives the order and returns a new data model, client side gets the data model and reders it into the view that it already holds in memory (or request the template file on the fly if you choose to configure it that way). 这意味着您将您的PurchaseSuccess.cshtmlPurchaseFail.cshtml作为视图模板放置在客户端,并让客户端进行渲染:您发出过帐请求以提交订单,服务器接收到订单并返回新的数据模型,客户端得到数据模型并将其重新添加到它已保存在内存中的视图中(如果您选择以这种方式进行配置,则可以动态请求模板文件)。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM