ng-repeat没有正确循环数组

时间:2016-11-26 08:07:31

标签: angularjs html5

我有数组

<tbody>{{contractsDeply}}
                        <tr ng-repeat="contract in contractsDeply track by $index">
                            {{contract}}
                            <td>{{ contract.contractID }}</td>
                            <td>{{ contract.contractName }}</td>
                        </tr>
                        </tbody>

并保存为$ scope.contractsDeply 我试图使用ng-repeat,但没有数据可用。

CloudStorageAccount storageAccount = CloudStorageAccount.Parse("UseDevelopmentStorage=true");

CloudBlobClient client = storageAccount.CreateCloudBlobClient();

CloudBlobContainer container = client.GetContainerReference("testname");

···

3 个答案:

答案 0 :(得分:0)

<强> HTML:

<body ng-app='app'>
  <div ng-controller="listController">
    <table class="table table-striped">
      <thead>
        <tr>
          <th ng-repeat="(key, value) in contractsDeply[0]">{{key | uppercase }}
          </th>
        </tr>
        <tbody>
          <tr ng-repeat="val in contractsDeply">
            <td ng-repeat="cell in val">
              <input type="text" ng-model="cell">
            </td>
          </tr>
        </tbody>
    </table>
  </div>
</body>

<强>控制器:

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

app.controller("listController", ["$scope", "$http",
  function($scope, $http) {

    $http.get('test.json').then(function(response) {
      $scope.contractsDeply = response.data;
      console.log($scope.contractsDeply);

    });

  }
]);

DEMO

答案 1 :(得分:0)

可能你缺少表格元素。请参阅示例。

<div ng-controller="myController as ctr">

                  <tbody>
                    <tr ng-repeat="contract in contractsDeply track by $index">
                        {{contract}}
                        <td>{{ contract.contractID }}</td>
                        <td>{{ contract.contractName }}</td>
                    </tr>
                    </tbody>
                 <p>
                 -------------------------
                 </p>   

                 <table>
                    <tr ng-repeat="contract in contractsDeply">
                        <td>{{ contract.contractID }}</td>
                        <td>{{ contract.contractName }}</td>
                    </tr>
                 </table>

</div>  

答案 2 :(得分:0)

  

HTML

<html>
<script src="library/angular.min.js"></script>
<script src="practice.js"></script>
<head>
</head>
<body ng-app="app">
<div ng-controller="test1">
<table>
<tbody>
    <tr ng-repeat="x in array">
        <td>{{x.contractID}}</td>
        <td>{{x.contractName}}</td>
        <td>{{x.supplierID}}</td>
        <td>{{x.productID}}</td>
    </tr>
</tbody>
</table>
</div>
</body>
</html>
  

Angularjs

angular.module('app',[]).controller('test1',function($scope){
    $scope.array=[{"contractID":1,"contractName":"test","supplierID":1,"supplierName":"test","productID":1,"productName":"test","uom":"each","quantity":1,"pricePerUOM":1,"totalPrice":1,"currency":"$","supplyByDate":"now","carrier":"FexEx","pickTo":"USA","shipTo":"USA","Trackingnumber":"test","signedBy":"buyer","pendingWith":"buyer","createdBy":"buyer","createdDate":"now","status":"closed","filler1":"","filler2":"","filler3":"","filler4":"","filler5":""},{"contractID":50,"contractName":"testinsert","supplierID":3,"supplierName":"testinsert","productID":1,"productName":"test","uom":"each","quantity":10,"pricePerUOM":10,"totalPrice":100,"currency":"$","supplyByDate":22112016,"carrier":null,"pickTo":null,"shipTo":null,"Trackingnumber":null,"signedBy":"buyer","pendingWith":"","createdBy":"buyer","createdDate":"22112016","status":"closed","filler1":null,"filler2":null,"filler3":null,"filler4":null,"filler5":null},{"contractID":60,"contractName":"testinsert","supplierID":3,"supplierName":"testinsert","productID":1,"productName":"test","uom":"each","quantity":10,"pricePerUOM":10,"totalPrice":100,"currency":"$","supplyByDate":22112016,"carrier":null,"pickTo":null,"shipTo":null,"Trackingnumber":null,"signedBy":"buyer","pendingWith":"","createdBy":"buyer","createdDate":"22112016","status":"closed","filler1":null,"filler2":null,"filler3":null,"filler4":null,"filler5":null}];   

});
  

我将数组保存在$ scope.array