Question

我在Asp.net Mvc5中使用AngularJs来创建单页面应用程序。我有一个问题，当我在表格中使用ng-repeat显示数据时，我的数据不显示在表格中但显示空行

这是我的家庭控制器

angularFormsApp.controller("HomeController",
    function ($scope, $location, DataService) {
        DataService.getEmployees().then(
            function (results) {
                $scope.names = results.data;
            console.log(results.data);
            console.log("This is console");
            },
            function (error) {
                // on error
                alert("error read data" + error);
            }
        );
    });

这是我的DataService

angularFormsApp.factory('DataService',
    function ($http) {

        var getEmployees = function () {

            return $http.get("Employee/GetEmployees");
        };
           return {
           
            getEmployees: getEmployees
        };
    });

这是我的Html页面

<div ng-app="angularFormsApp">
  <div ng-controller="HomeController">
      {{ Namef }}

      <table class="table table-hover ">
          <thead>
              <tr>
                  <th>Name Employee</th>
                 <th>Note</th>
              </tr>
          </thead>
          <tbody>
              <tr ng-repeat="item in names">
                  <td>{{ item.FullName }}</td>
                  <td>{{ item.Note }}</td>
                  <td>
                      <a href="#!editor/{{ item.Id }}" class="btn btn-sm btn-info">Edite</a>
                      <a href="#" class="btn btn-sm btn-danger">Delete</a>
                  </td>
              </tr>
          </tbody>
      </table>
  </div>
</div>

这是我的员工控制器

public class EmployeeController : Controller
{
    // GET: Employee
    DataLayer.WebapplicationContext db = new DataLayer.WebapplicationContext();
    public ActionResult GetEmployees()
    {
        var data = db.Employees.ToList();   
        var camelCaseFormatter = new JsonSerializerSettings();
        camelCaseFormatter.ContractResolver = new CamelCasePropertyNamesContractResolver();
        var jsonResult = new ContentResult
        {
            Content = JsonConvert.SerializeObject(data, camelCaseFormatter),
            ContentType = "application/json"
        };
        return jsonResult;
        //return new HttpStatusCodeResult(404, "Our custom error message...");
    }

当我运行这个项目时，我看到空行，它上面的图片显示我的问题。 Picture

这是控制台日志enter image description here

Answer 1

我尝试使用此代码并解决我的问题。在EmployeeController将ActionResult更改为JsonResult

 public JsonResult GetEmployees()
    {
          using (WebapplicationContext Obj = new WebapplicationContext())
        {
            List<Employee> Emp = Obj.Employees.ToList();
            return Json(Emp, JsonRequestBehavior.AllowGet);
        }
    }

AngularJs中的ng-repeat不显示表中的数据，但显示空行

1 个答案: