ビューに結果が表示されません。 Angularjs MVC

-2

私は、角度jを持つasp.mvcを使用してデータベースからレコードを取得しようとしていますが、レコードを取得できません。ビューに結果が表示されません。 Angularjs MVC

私は従業員表

従業員のコントローラー

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Web; 
using System.Web.Mvc; 
using SelectData.Models; 

namespace SelectData.Controllers 
{ 
    public class EmployeeController : Controller 
    { 
     // GET: Employee 
     public ActionResult Index() 
     { 
      return View(); 
     } 

     public ActionResult getAll() 
     { 
      using (EmployeeDBEntities dbContext = new EmployeeDBEntities()) 
      { 
       var employeeList = dbContext.Employees.ToList(); 
       return View(employeeList); 
      } 
     } 
    } 
}

角度JSモジュール

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

角度JSサービス

を持っています0

app.service("EmployeeService", function ($http) { 
    this.getEmployee = function() { 
     debugger; 
     return $http.get("/employee/getAll"); 
    }; 
});

角度JSコントローラ

app.controller("EmpCtrl", function ($scope, EmployeeService) { 
    GetAllEmployee(); 

    function GetAllEmployee() { 
     debugger; 
     var getAllEmployee = EmployeeService.getEmployee(); 
     getAllEmployee.then(function (emp) { 
      $scope.employees = emp.data; 
     }, function() { 
      alert('Data not found'); 
     }); 
    } 
});

表示

@{ 
    ViewBag.Title = "getAll"; 
    Layout = "~/Views/Shared/_Layout.cshtml"; 
} 

<div ng-controller="EmpCtrl"> 
    <div> 
     <h2 align="center">Angular JS Basic Example</h2> 
     <h5 align="center">Employee List</h5> 
     <table border="1" cellpadding="10" align="center"> 
      <tr> 
       <td> 
        Employee Id 
       </td> 
       <td> 
        First Name 
       </td> 
       <td> 
        Address 
       </td> 
      </tr> 
      <tr ng-repeat="emp in employees"> 
       <td> 
        {{emp.EmpId}} 
       </td> 
       <td> 
        {{emp.FirstName}} 
       </td> 
       <td> 
        {{emp.LastName}} 
       </td> 
      </tr> 
     </table> 
    </div> 
</div>

_Layout.cshtml

<!DOCTYPE html> 
<html ng-app="AngularApp"> 

<head> 
    <meta charset="utf-8" /> 
    <meta name="viewport" content="width=device-width" /> 
    <title>@ViewBag.Title</title> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.13/angular.min.js"></script> 
    <script src="~/Content/angular/Module.js"></script> 
    <script src="~/Content/angular/Service.js"></script> 
    <script src="~/Content/angular/Controller.js"></script> @Styles.Render("~/Content/css") 
</head> 

<body> 
    @RenderBody() @Scripts.Render("~/bundles/jquery") @RenderSection("scripts", required: false) 
</body> 

</html>

データは、ブラウザに表示されていないが、それはブラウザにJSON形式として示しています。あなたのgetAllアクションメソッドは、基本的にHTMLマークアップ（文字列）であるビューの結果を返して

出典

2016-08-29 user1030181

ブラウザのコンソールでjsエラーがないか確認してください。 httpコールをしていますか？ネットワークタブを確認してください。あなたのコードは正常に見えます。それらのプロパティ（ 'EmpId'）を持つアイテムの配列を返しますか？ – Shyju

はいhttpコールを行っています – user1030181

APIから何が返されていますか？ –

を提案してください。あなたのデータを表すjson配列を返す必要があります。あなたの配列内の各アイテムEmpId、FirstNameとLastName性質を持っている必要があります。..

public ActionResult getAll() 
{ 
    using (var db = new EmployeeDBEntities()) 
    { 
     var employeeList = db.Employees.Select(f=>new { EmpId =f.EmpId , 
                 FirstName = f.FirstName, 
                 LastName = f.LastName } 
              ).ToList(); 
     return Json(employeeList,JsonRequestBehavior.AllowGet); 
    } 
}

ここで私はAnnonymousのオブジェクトに従業員のアイテムを投影しています。したがって、getAllの結果は、jsonのような配列になります。あなたの角度のコードがところで、あなたのマークアップコードは（getAll.cshtml以外の）別のビューにする必要がありますng-repeat

のために使用することが可能になりますし、ブラウザでそのアクションメソッドにアクセスしようとする必要があり

[ 
    { 
     "EmpId": 1, 
     "FirstName": "Shyju", 
     "FirstName": "K" 
    } 
]

（インデックス表示になることがありますか？）

出典

2016-08-29 19:25:33 Shyju

jsonファイルをダウンロードしますが、表示されていないビューのデータは表示されません。 – user1030181

ファイルをダウンロードすることを意味しますか？ブラウザのネットワークタブを開き、このajax呼び出し。それは配列ではありませんか？ – Shyju

これは、このデータ '{{" EmpId "：1、" FirstName "：" Andy "、" LastName "：" Toe "}、{" EmpId "：2、" FirstName "：" Jessie "を持つgetAll.jsonファイルをダウンロードします。 "、" LastName "：" Ed "}、{" EmpId "：3、" FirstName "：" John "、" LastName "：" Heslop "}、{" EmpId "：4、" FirstName "：" Lucy " "LastName"： "Stall"}] ' – user1030181

ビューに結果が表示されません。 Angularjs MVC

答えて

関連する問題