MVC应用程序不显示视图中的数据。
我是MVC和AngularJs的新手。我的问题是-我正在使用ng-重复显示数据。调试显示，javascript和MVC控制器中的数据检索都是正确的。即使是ng-重复也能正常工作，但是所有的行都是在没有任何数据的情况下生成的。我的意思是生成12行空白。下面是Json的数据。
{"categoryID":1，“categoryName”：“饮料”，“描述”：“软饮料、咖啡、茶、啤酒和啤酒”}、{"categoryID":2、“categoryName”：“调味品”、“描述”：“甜味调味汁、调味品、调料”}、{"categoryID":3、“categoryName”：“categoryName”、“描述”：“Desserts、糖果和甜面包”}，{"categoryID":4，“categoryName”：“奶制品”，“描述”：“奶酪”}，{"categoryID":5，“categoryName”：“谷物/谷物”，“描述”：“面包、饼干、意大利面和谷物”}，{"categoryID":6，“categoryName”：“肉类/家禽”，“描述”：“准备好的肉类”}，{"categoryID":7，“categoryName”：“农产品”，“描述”：“干水果和豆腐”}，{"categoryID":8，“categoryName”：“海鲜”，“描述”：“海草和鱼类”} {"categoryID":9，"categoryName":"www"，“categoryName”}，{“ghhhh”}，{"categoryID":10，"categoryName":"bbb"，“描述”：“nnn”}，{"categoryID":11，"categoryName":"asd"，“asd”：“sdsad”}，{"categoryID":12，"categoryName":"ssfsf"，“描述”：“af1”}
这是我的控制器(CategoryController.cs)
public ActionResult GetCategory()
{
var categoryList = from cat in _db.Categories
select new
{
cat.CategoryID,
cat.CategoryName,
cat.Description
};
return Json(categoryList, JsonRequestBehavior.AllowGet);
}我的app.js文件
var myApp = angular.module('myApp', ['ngRoute', 'ngResource', 'ui.bootstrap']);我的Router.js文件
myApp.config(['$routeProvider', function ($routeProvider) {
$routeProvider.when('/', {
templateUrl: "App/Home/home.html"
}),
$routeProvider.when('/about', {
templateUrl: "App/Home/about.html"
}),
$routeProvider.when('/category', {
templateUrl: "App/Category/Html/categoryList.html",
controller: "categoryController"
});
}]);我的categoryController.js文件
myApp.controller('categoryController',
['$scope', 'categoryDataService', '$location',
function categoryController($scope, categoryDataService) {
$scope.categories = [];
loadCategoryData();
function loadCategoryData() {
categoryDataService.getCategories()
.then(function () {
$scope.categories = categoryDataService.categories;
},
function () {
alert("Error");
})
.then(function () {
$scope.isBusy = false;
});
};
}]);我的categoryDataService.js文件
myApp.factory('categoryDataService', ['$http', '$q',
function ($http, $q) {
var _categories = [];
var _getCategories = function() {
var deferred = $q.defer();
var controllerQuery = "Category/GetCategory";
$http.get(controllerQuery)
.then(function(result) {
// Successful
angular.copy(result.data, _categories);
deferred.resolve();
},
function(error) {
// Error
deferred.reject();
});
return deferred.promise;
};
//Expose methods and fields through revealing pattern
return {
categories: _categories,
getCategories: _getCategories
}
}]);我的CategoryList.html文件。
<div class="table table-responsive">
<table class="table table-striped">
<thead>
<tr>
<td>Id</td>
<td>Category Name</td>
<td>Description</td>
<td></td>
</tr>
</thead>
<tbody>
<tr ng-repeat="category in categories | filter:search_txt ">
<td>{{category.CategoryID}}</td>
<td>{{category.CategoryName}}</td>
<td>{{category.Description}}</td>
<td>
<a class="btn btn-primary" href="#/category/{{CategoryId.id}}">
<i class="glyphicon glyphicon-edit"></i></a>
</td>
</tr>
</tbody>
</table>
</div>包含Index.cshtml文件的CategoryList.html文件。我的Index.cshtml
<div class="ng-view"> </div>_Layout.cshtml如下所示
<!DOCTYPE html>
<html ng-app="myApp">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>@ViewBag.Title - North Wind</title>
@Styles.Render("~/Content/css")
@*@Scripts.Render("~/bundels/modernizr")*@
<script src="~/Scripts/modernizr-2.6.2.js"></script>
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
@Html.ActionLink("Northwind", "Index", "Home", null, new { @class = "navbar-brand" })
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li><a href="#/">Home</a></li>
<li><a href="#/category">Category</a></li>
<li><a href="#/customer">Customer</a></li>
<li><a href="#/about">About</a></li>
</ul>
</div>
</div>
</div>
<div class="container body-content">
@RenderBody()
</div>
<hr />
<footer>
<div class="container">
<p>© @DateTime.Now.Year - My ASP.NET Application</p>
</div>
</footer>
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")
@Scripts.Render("~/bundles/angularApp")
@RenderSection("scripts", required: false)
</body>
</html>我的模型文件：
namespace WebApp1.Models
{
using System;
using System.Collections.Generic;
public partial class Category
{
public int CategoryID { get; set; }
public string CategoryName { get; set; }
public string Description { get; set; }
public byte[] Picture { get; set; }
}
}为了让你更好地理解，我给出了洞码。任何帮助都将不胜感激。
谢谢
帕莎
回答 1
Stack Overflow用户
发布于 2015-10-15 10:23:15
如果您能够生成您的行，并且按您所说的那样正确地请求数据，那么我相信您正面临一个问题，原因是您的角度数据库中的表达式如下：
{{category.CategoryName}}
代之以
{{category.categoryName}}
并对json对象的每个属性重复此操作。
https://stackoverflow.com/questions/33145855
复制相似问题
腾讯云开发者
