从 AngularJS 控制器调用 Asp.Net MVC 5 视图答案

【问题标题】：Calling Asp.Net MVC 5 View from AngularJS Controller从 AngularJS 控制器调用 Asp.Net MVC 5 视图
【发布时间】：2016-07-28 10:04:12
【问题描述】：

我尝试在成功登录后重定向到主页。目前，我正在使用 ASP.NET MVC 5、AngularJS、EntityFramework 6、引导程序和存储库模式。下面是我的 LoginController 的代码：

public JsonResult UserLogin(STUDENTMANAGEMENTUSER data)
    {
        var user = repository.UserLogin(data);
        return new JsonResult { Data = user, JsonRequestBehavior = JsonRequestBehavior.AllowGet };
    }

AngularJS 控制器的代码：

app.controller("mvcLoginCtrl", function ($scope, loginAJService) {
$scope.IsLoggedIn = false;
$scope.Message = '';
$scope.Submitted = false;
$scope.IsFormValid = false;

$scope.LoginData = {
    USERNAME: '',
    USERPASSWORD: ''
};

//Check is Form Valid or Not // Here f1 is our form Name
$scope.$watch('f1.$valid', function (newVal) {
    $scope.IsFormValid = newVal;
});

$scope.Login = function () {
    $scope.Submitted = true;
    if ($scope.IsFormValid) {
        loginAJService.GetUser($scope.LoginData).then(function (d) {
            if (d.data.USERNAME != null) {
                $scope.IsLoggedIn = true;
                $scope.Message = "Successfully login done. Welcome " + d.data.FULLNAME;  
            }
            else {
                alert('Invalid Credential!');
            }
        });
    }
};});

和我的 AngularJS 服务的代码：

app.service("loginAJService", function ($http) {

this.GetUser = function (d) {
    var response = $http({
        method: "post",
        url: "Login/UserLogin",
        data: JSON.stringify(d),
        dataType: "json"
    });
    return response;
};});

我想在成功登录后重定向到 Student/Index.cshtml。我怎样才能做到这一点？

【问题讨论】：

标签： angularjs asp.net-mvc-5 entity-framework-6

【解决方案1】：

您不能直接访问 .cshtml 视图。您可以通过操作方法访问它。所以创建一个动作方法来返回这个视图（如果不存在的话）

public ActionResult StudentIndex()
{
  // you may pass a view model to the view as needed
  return View("~/Views/Student/Index.cshtml");
}

现在在您登录成功后，只需重定向到此操作方法即可。

if (d.data.USERNAME != null) {
      $scope.IsLoggedIn = true;
      $scope.Message = "Successfully login done. Welcome " + d.data.FULLNAME; 
      window.location.href='/YourControllerName/StudentIndex'; 
}

由于您正在执行重定向（对 StudentIndex 的全新 Http GET 请求，因此设置范围属性值没有意义。

【讨论】：

感谢您的回复，它有效。我想知道的另一件事是，我必须将$scope.Message = "Successfully login done. Welcome " + d.data.FULLNAME; 这个变量传递给/Student/Index.cshtml 视图。我该怎么做？
你应该遵循 PRG 模式。因此，在学生/索引中查询您的用户信息并显示您想要执行的任何消息

【解决方案2】：

你试过了吗：

return Json 
(
   new {
           Data = user,
           JsonRequestBehavior = JsonRequestBehavior.AllowGet,
           redirectUrl = @Url.Action("UserLogin", "LoginController")
       }
);

然后在 $http.post 中等待成功回调：

success: function(data) {
    window.location.href = data.redirectUrl;
}

【讨论】：