[英]Use ASP.NET MVC routing parameters showing undefined in angular js controller
This is my Url which is using asp.net MVC routing 这是我的网址,它使用asp.net MVC路由
http://localhost:23293/Exam?id=1
i want to access id parameter in angular js controller 我想访问angular js控制器中的id参数
aoeapp.controller('ExamController', function ($scope, examservice, $routeParams) {
$scope.exams = [];
$scope.id = $routeParams.id;
alert($scope.id);
$scope.getAllexams = function (id) {
examservice.getExamMaster(id).success(function (data) {
$scope.exams = data;
}).error(function (data, status, Xhr) {
alert(Xhr);
});
};
$scope.getAllexams(id);
});
so here $scope.id showing undefined 所以这里$ scope.id显示未定义
My mvc routing is just default routing 我的MVC路由只是默认路由
Edit The angular routes 编辑角度路线
aoeapp.config(function ($routeProvider) {
$routeProvider.when('/', {
controller: 'HomeController',
templateUrl: 'Pages/Home.html'
}).when('/Exam/:id', {
controller: 'ExamController',
templateUrl: 'Pages/Exam.html'
}).when('/Test/:id', {
controller: 'TestController',
templateUrl: 'Pages/Test.html'
}).otherwise({ redirectTo: '/' });
});
I had a similar issue, where my Angular routes were routed to my MVC controllers. 我有一个类似的问题,我的Angular路由被路由到我的MVC控制器。 I fixed it using a catchall route: 我使用综合路线修复了它:
Add this route to your App_Start/RouteConfig.cs
: 将此路由添加到您的App_Start/RouteConfig.cs
:
routes.MapMvcAttributeRoutes();
routes.MapRoute(
name: "Angular",
url: "Exam/{*url}",
defaults: new {controller = "Angular", action = "Index" }
);
With the following action in your Controllers/AngularController.cs
file: 在Controllers/AngularController.cs
文件中执行以下操作:
[Route("Exam/{*url}")]
public ActionResult Index()
{
return View();
}
This should intercept all calls to the /Exam
and redirect them to your Angular router. 这应该拦截对/Exam
所有调用,并将它们重定向到您的Angular路由器。 You may have to play a litle with the Route
attribute name. 您可能需要使用Route
属性名称来玩一玩。
I fixed this problem with a different approach. 我用另一种方法解决了这个问题。 I created a ViewBag
variable to store the query string or the id, you can also use the model
, and then pass it into an angular method. 我创建了一个ViewBag
变量来存储查询字符串或id,您也可以使用model
,然后将其传递给angular方法。 You can understand this more clearly by going through the code: 您可以通过以下代码来更清楚地理解这一点:
Razor View 剃刀视图
<form name="ExamForm" ng-init="$scope.setQueryStringToScopeId(@ViewBag.Id)">
....
</form>
Angular Controller 角度控制器
aoeapp.controller('ExamController', function ($scope, examservice) {
$scope.id = 0;
$scope.setQueryStringToScopeId = function(id) {
$scope.id = id;
};
....
});
MVC Controller MVC控制器
public ActionResult Exam()
{
ViewBag.Id = Request.QueryString["Id"];
return View();
}
You can also use the query string directly in your Razor View
. 您也可以直接在Razor View
使用查询字符串。 Let me know if this works for you. 如果这对您有用,请告诉我。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.