MVC. AngularJS. Send and Get Parameters + Call Service [HttpGet]
Автор: Administrator.
Подробности и исходники в статье под катом.
Проект mvc
HomeController.cs
using System.Linq; using System.Web.Mvc; using DataAccess; namespace MvcAngular.Web.Controllers { public class HomeController : Controller { public ActionResult Index() { return View(); } public ActionResult Home() { return PartialView(); } [HttpGet] public JsonResult GetAllData() { var repository = new ResumeDataRepository(); var data = repository.GetResumes().OrderBy(x => x.GeneralInformation.FirstName).ToList(); return Json(data, JsonRequestBehavior.AllowGet); } public ActionResult About() { return PartialView(); } } }
Home.cshtml
<div class="row"> <div class="span12"> <div id="list-all"> <table class="list-users"> <tr ng-repeat="user in data"> <td class="name"><a href="#!/about/{{user.Id}}">{{user.GeneralInformation.FirstName}} {{user.GeneralInformation.LastName}}</a></td> <td class="title">{{user.GeneralInformation.Position}}</td> <td class="lastModified">{{user.GeneralInformation.Date}}</td> </tr> </table> </div> </div> </div>
homeModule.js
angular .module('myApp', [ 'myApp.ctrl.home', 'myApp.ctrl.about' ]) .config(['$routeProvider', '$locationProvider', function ($routeProvider, $locationProvider) { $routeProvider.when('/', { templateUrl: '/Home/Home', controller: 'homeCtrl', }); $routeProvider.when('/about/:Id', { templateUrl: '/Home/About', controller: 'aboutCtrl' }); $routeProvider.otherwise({ redirectTo: '/' }); // Specify HTML5 mode (using the History APIs) or HashBang syntax. $locationProvider.html5Mode(false).hashPrefix('!'); }]);
aboutCtrl.js
angular .module('myApp.ctrl.about', []) .controller('aboutCtrl', ['$scope', '$routeParams', '$http', function ($scope, $routeParams, $http) { $scope.userId = $routeParams.Id; alert($routeParams.Id); }]);