Javascript 我的ng表没有显示任何内容

我开始使用ng表，但是当我尝试加载数组时，页面上没有显示任何内容

短暂显示{x.Name}和{x.Country}

有什么建议吗

多谢各位

查看

<div ng-app="ruyApp" ng-controller="equipasCtrl" ng-init="init(@Newtonsoft.Json.JsonConvert.SerializeObject(Model))">

<div class="row">

    <table class="table" ng-table="equipasTable" show-filter="true">
            <tr ng-repeat= "x in data">   
                <td data-title="'Nome'" >
                    {{x.Nome}}
                </td>
                <td data-title="'Country'">
                    {{x.Country}}
                </td>
                <td>
                    <a href="Equipas/Edit/{{x.EquipaID}}"> Editar</a> |
                    <a href="Equipas/Details/{{x.EquipaID}}"> Detalhes</a> |
                    <a href="Equipas/Delete/{{x.EquipaID}}"> Eliminar</a>                       
                </td>
            </tr>


    </table>
    </div>

---

正如Thanh Tùng所指出的，你只需要改变

<tr ng-repeat= "x in data"> 

到

---

正如Thanh Tùng所指出的，你只需要改变

<tr ng-repeat= "x in data"> 

到

---

我认为以HTML和脚本呈现数据的方式不正确。更新代码，如下所示

查看

<div ng-app="ruyApp" ng-controller="equipasCtrl" ng-init="init(@Newtonsoft.Json.JsonConvert.SerializeObject(Model))">
  <table ng-table="equipasTable" class="table" show-filter="true">
    <tbody>
      <tr ng-repeat="row in $data">
        <td data-title="'Name'"  sortable="'name'">{{ row.Nome }}</td>
        <td data-title="'Country'"  sortable="'age'">{{ row.Country }}</td>
        <td>
            <a href="Equipas/Edit/{{x.EquipaID}}"> Editar</a> |
            <a href="Equipas/Details/{{x.EquipaID}}"> Detalhes</a> |
            <a href="Equipas/Delete/{{x.EquipaID}}"> Eliminar</a>                       
        </td>
      </tr>
    </tbody>
  </table>
</div>

---

我认为以HTML和脚本呈现数据的方式是不正确的。更新代码，如下所示

查看

<div ng-app="ruyApp" ng-controller="equipasCtrl" ng-init="init(@Newtonsoft.Json.JsonConvert.SerializeObject(Model))">
  <table ng-table="equipasTable" class="table" show-filter="true">
    <tbody>
      <tr ng-repeat="row in $data">
        <td data-title="'Name'"  sortable="'name'">{{ row.Nome }}</td>
        <td data-title="'Country'"  sortable="'age'">{{ row.Country }}</td>
        <td>
            <a href="Equipas/Edit/{{x.EquipaID}}"> Editar</a> |
            <a href="Equipas/Details/{{x.EquipaID}}"> Detalhes</a> |
            <a href="Equipas/Delete/{{x.EquipaID}}"> Eliminar</a>                       
        </td>
      </tr>
    </tbody>
  </table>
</div>

---

如果要在

equipas

中显示，请尝试在equipas中显示

x

如果要在

equipas

中显示，请尝试在equipas中显示

x

如何使该条显示在页面选择的左侧？我只能在右侧看到10 | 15 | 50 |条，因此需要覆盖CSS。我已经更新了演示链接。请检查一下，让我知道它是否适合你，不是吗，维卡什。我说的是选择页面的控件。好的。你是说分页。我已经更新了我的演示链接和答案，以及请检查它。您需要在设置中添加total属性。让我知道它是否适用于您（仅此而已Vikash:）如何使该栏显示在页面选择的左侧？我只能在右侧看到10 | 15 | 50 |条，因此需要覆盖CSS。我已经更新了演示链接。请检查一下，让我知道它是否适合你，不是吗，维卡什。我说的是选择页面的控件。好的。你是说分页。我已经更新了我的演示链接和答案，以及请检查它。您需要在设置中添加total属性。让我知道它是否适合你就这样Vikash:）

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

app.controller('equipasCtrl', function($scope, $filter, $q, NgTableParams) {
 $scope.equipas = [{
  Nome: "Benfica",
  Country: "Portugal"
 }, {
  Nome: "Porto",
  Country: "Portugal"
 }, {
  Nome: "Real Madrid",
  Country: "Spain"
 }];

 $scope.equipasTable = new NgTableParams({
  page: 1,
  count: 10
 }, {
  total: equipas.length, 
  getData: function($defer, params) {
   $scope.data = equipas.slice((params.page() - 1) * params.count(), params.page() * params.count());
   $defer.resolve($scope.data);
  }
  });
});