Question

我在某个部分模型上有这个json信息。我有想法在这里显示的项目缩略图的长滚动列表中显示信息：http://ionicframework.com/docs/components/#item-thumbnails

但是当我尝试对这个组件使用ng-repeat时，我得到一个空白屏幕。怎么没出现？

.controller('EquipCtrl', function() {
    var equipment = [];
    var equip = {
      "EquipmentID": "gxfrc-3452-e1c33-bcedf-432dd-53432-dff3d",
      "ItemName": "Truck 1",
      "ModelName": "3500",
      "SerialNumber": "12355234",
      "VendorName": "Ford",
      "DimensionsLength": "15",
      "DimensionsWidth": "10",
      "DimensionsHeight": "10",
      "DimensionsWeight": "20000",
      "Comments": "Local owned vehicle",
      "Photo": "truck1photo.jpg",
      };

   equipment.push(equip);
})

<body ng-app="starter">
      <ion-view>
          <div class="list" ng-repeat="equip in equipment">
             <a class="item item-thumbnail-left">
              <img>{{equip.Photo}}</img>
              <h2>{{equip.SerialNumber}}</h2>
              <p>{{equip.ItemName}}</p>
            </a>
          </div>
      </ion-view>
</body>

我确信我做错了。任何人都可以帮我弄清楚为什么我的屏幕是空白的？我之前使用过ng-repeat，但从未使用过item-thumbnail组件。

Answer 1

您需要注入$scope并为其分配设备变量

.controller('EquipCtrl', function($scope) {
$scope.equipment = [];
var equip = {
  "EquipmentID": "gxfrc-3452-e1c33-bcedf-432dd-53432-dff3d",
  "ItemName": "Truck 1",
  "ModelName": "3500",
  "SerialNumber": "12355234",
  "VendorName": "Ford",
  "DimensionsLength": "15",
  "DimensionsWidth": "10",
  "DimensionsHeight": "10",
  "DimensionsWeight": "20000",
  "Comments": "Local owned vehicle",
  "Photo": "truck1photo.jpg",
  };
 $scope.equipment.push(equip);
})

您可能需要在模板中设置控制器

<body ng-app="starter">
      <ion-view ng-controller="EquipCtrl">
          <div class="list" ng-repeat="equip in equipment">
             <a class="item item-thumbnail-left">
              <img>{{equip.Photo}}</img>
              <h2>{{equip.SerialNumber}}</h2>
              <p>{{equip.ItemName}}</p>
            </a>
          </div>
      </ion-view>
</body>

在角度中使用ng-repeat

1 个答案: