Получает данные в формате Json от контроллера AngularJs

76
10

Мне сложно с AngularJs. В некоторых случаях это работает для меня, и когда я пытаюсь изменить шаблон проекта, он больше не работает. Вот сценарий - у меня есть контроллер в ASP.NET MVC который возвращает список продуктов в формате Json, и, наконец, я вызываю этот контроллер с помощью контроллера AngularJs следующим образом:

С#:

public JsonResult GetProducts()
{
var result = (from c in db.Products
select new { c.ProductName, c.Price }).ToList();

return Json(result, JsonRequestBehavior.AllowGet);
}

AngularJs:

var app = angular.module('app', []);

app.controller('ProductController', function ($scope, ProductService) {
$scope.Products = null;

ProductService.GetProducts().then(function (d) {
$scope.Products = d.data;

}, function () {
alert('Failed');
});
});

app.factory('ProductService', function ($http) {
var factory = {};

factory.GetProducts = function () {
return $http.get('/Product/GetProducts');
}
return factory;
});

В пользовательском интерфейсе я использовал следующее:

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Get Products</title>

<script src="~/Scripts/angular.js"></script>
<script src="../AngularFile/AddToCart.js"></script>
</head>
<body>
<div>
<h2>Get Products</h2>
<div ng-app="app" class="container">
<br /><br />
<br /><br />
<input type="text" ng-model="name" />
<h1>{{ name }}</h1>
<div ng-controller="ProductController">
<table class="table table-responsive" ng-repeat="m in Products">
<tr>
<td>{{ m.ProductName }}</td>
<td>{{ m.Price }}</td>
</tr>
</table>
</div>
</div>
</div>
</body>
</html>

Результат, который я получаю, таков:

Sample Products


Я не уверен, что я делаю неправильно. В моем предыдущем проекте, используя тот же код, он показывает продукты правильно, но прямо сейчас, я получаю данные в формате Json. Является ли это обычным, и кто-то сталкивался с этим раньше?

Примечание. Если я изменил тип метода с JsonResult на ActionResult, он ничего не показывает.

спросил(а) 2017-10-21T10:18:00+03:00 3 года, 5 месяцев назад
0
Ваш ответ
Введите минимум 50 символов
Чтобы , пожалуйста,
Выберите тему жалобы:

Другая проблема