【问题标题】:Display all the models using API and MVC4使用 API 和 MVC4 显示所有模型
【发布时间】:2015-10-14 09:27:51
【问题描述】:

我创建了一个 API 应用程序,我可以在其中执行 crud 操作。但是,我无法在我的 cshtml 中显示所有模型。 我已经创建了我的 API 控制器,它具有 getAllUsers 方法,在我的主控制器中,我只调用索引视图。在我看来,我有一个调用 getAllUsers 方法的脚本。下面是我的代码: API 控制器:

namespace WebApiQues.Controllers
{
    public class UserController : ApiController
    {
        private WebApiQuesEntities db = new WebApiQuesEntities();

        //Get all users
        public IEnumerable<User> GetAllUsers()
        {
            var UserList = from s in db.Users
                           orderby s.Id
                            select s;

            return UserList;
        }
}

控制器:

 public class HomeController : Controller
{
    //
    // GET: /Home/

    public UserController userController = new UserController();

    public ActionResult Index()
    {
        //var UserList = userController.GetAllUsers();
        //ViewBag.UserList = UserList;
        return View();
    }

}

Index.cshtml:

@{
ViewBag.Title = "Index";
}

@model IEnumerable<WebApiQues.Models.User>
<div>

  <div>
    <h2>All Products</h2>
    <ul id="products" />
  </div>
  </div>

  <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.0.3.min.js"></script>
  <script type="text/javascript">
      var uri = 'api/user/getallusers';

      $(document).ready(function () {
          // Send an AJAX request
          $.getJSON(uri)
          .done(function (data) {
              // On success, 'data' contains a list of products.
              $.each(data, function (data) {
                  // Add a list item for the product.
                  $('<li>').appendTo($('#products'));
              });
          });
      });
</script>

我相信问题来自 cshtml 中的脚本,但我找不到我做错的地方。有什么想法吗?

编辑: 如果我添加一个 console.log(data),我可以看到 data 有用户列表。

【问题讨论】:

  • 你检查过'getallusers'是否工作正常吗?我的意思是使用 Fiddler 或 PostMan
  • 是的,它运作良好。如果我输入“localhost:3111/api/user/getallusers”,我会得到所有用户的列表。
  • $.getJSON(uri) 指的是'uri',它是不完整的,即它应该是localhost/api/user/getallusers.... 检查浏览器的提琴手或开发工具,看看什么 WEB API 正在形成
  • 非。脚本获取的数据确实包含所有模型的列表。我刚刚更新了我的问题。
  • 在我看来,您只是将一个空的
  • 附加到您的产品 ul 中,但您没有在“每个”函数中使用任何“数据” - 或者您是否剥离了它部分代码出来了?

标签: c# asp.net-mvc-4 asp.net-web-api


【解决方案1】:

试试这个:

将您的 jquery 脚本添加到 scripts section:

@section scripts
{
 <script type="text/javascript">
     $(function() {
         var uri = 'api/user/getallusers';
         $.getJSON(uri, function(data) {
             $.each(data, function(index, v) {
                 $('#products').append('<li>'+v.PropertyName+'</li>'); 
                 //Change property name to the property of your object
             });
         });
     });
 </script>
}

$.each 在回调函数中需要两个参数:数组的索引和实际的数据对象本身:

回调类型:Function(Integer indexInArray, Object value) 将在每个对象上执行的函数。

http://api.jquery.com/jquery.each/

【讨论】:

    【解决方案2】:

    假设用户有“姓名”属性,试试这个代码

    $.getJSON(uri)
              .done(function (data) {
                  // On success, 'data' contains a list of products.
                  $.each(data, function (data) {
                      // Add a list item for the product.                  
                      $('#products').append('<li>'+data.Name+'</li>');
                  });
              });
    

    【讨论】:

    • 我尝试使用用户的属性 Fname,但它给了我未定义的,而不是 Fname。
    • 你能分享一下console.log(data)的输出吗?
    • [Object, Object, Object, Object]0: ObjectAge: 20City: "PL"Fname: "A"Id: 1Lname: "Ah"proto: Object1: Object2 : Object3: Objectlength: 4__proto__: Array[0]
    • 响应数据很笨拙或大部分格式不正确。您在 web api 中使用什么样的合同解析器,即 camelCase??
    • 没关系,我在上面得到了答案。不过感谢您的帮助。
    猜你喜欢
    相关资源
    最近更新 更多
    热门标签