你正在声明里面的控制器 ng-repeat (这是不正确的,您只需要一个控制器实例来处理整个集合,而不需要集合中每个元素的一个(控制器)实例),所以更改
ng-repeat
的 这个 强> <div ng-app="mainApp">
<div ng-app="mainApp">
的 至 强> <div ng-app="mainApp" ng-controller="mainScripts">
<div ng-app="mainApp" ng-controller="mainScripts">
和 的 这个 强> <div class="tile draggable" ng-controller="mainScripts" ng-repeat="stuff in titles">
<div class="tile draggable" ng-controller="mainScripts" ng-repeat="stuff in titles">
的 至 强> 这个 <div class="tile draggable" ng-repeat="stuff in titles">
<div class="tile draggable" ng-repeat="stuff in titles">
此外,您错误地放置了错误回调...请参阅下面的工作示例(模拟数据)
var mainApp = angular.module('mainApp', []); mainApp.controller('mainScripts', function($scope, $http) { var data = { "deviceTypes": [{ "description": "Air Handler", "typeName": "AirSource" }, { "description": "VAV Terminal", "typeName": "AirTerminal" }, { "description": "Fan Coil", "typeName": "ChilledWaterTerminal" }, { "description": "Chiller", "typeName": "ChilledWaterSource" }, { "description": "Generic Unit", "typeName": "NoResources" }, { "description": "Other Source", "typeName": "OtherSource" }, { "description": "Other Terminal", "typeName": "OtherTerminal" }, { "description": "Water Manager", "typeName": "WaterSource" }, { "description": "WSHP Terminal", "typeName": "WaterTerminal" }], "deviceList": [{ "href": "../MISRest/devices/3101117", "location": "Loc Desk 3 VAV", "description": "VAV 117", "objectName": "VAV 117", "instance": "3101117", "occupancy": "Occupied", "schedule": "Standard Schedule", "ignore": "False", "commStatus": "None", "alarmStatus": "None", "macaddress": "117", "directSchedule": "True", "rogueZone": "False", "parentID": { "air": "0" }, "deviceType": ["AirTerminal"] }, { "href": "../MISRest/devices/3101121", "location": "Loc Desk 4 with temp VAV", "description": "VAV 121", "objectName": "VAV Actuator Series 2 Bacnet ASC Controller", "instance": "3101121", "occupancy": "Error", "schedule": "Standard Schedule", "ignore": "False", "commStatus": "Fault", "alarmStatus": "Active", "macaddress": "121", "directSchedule": "True", "rogueZone": "False", "parentID": { "air": "0" }, "deviceType": ["AirTerminal"] }, { "href": "../MISRest/devices/3101004", "location": "New Paris", "description": "KMC Device", "objectName": "BAC-8205_001635", "instance": "3101004", "occupancy": "Error", "schedule": "Standard Schedule", "ignore": "False", "commStatus": "None", "alarmStatus": "None", "macaddress": "4", "directSchedule": "True", "rogueZone": "False", "deviceType": ["NoResources"] }, { "href": "../MISRest/devices/3101013", "location": "Default Location", "description": "VAV-013", "objectName": "DEFAULT", "instance": "3101013", "occupancy": "Occupied", "schedule": "None", "ignore": "False", "commStatus": "None", "alarmStatus": "None", "macaddress": "13", "directSchedule": "True", "rogueZone": "False", "parentID": { "air": "0" }, "deviceType": ["AirTerminal"] }, { "href": "../MISRest/devices/3101066", "location": "Loc Desk AHU (1st)", "description": "Desk AHU 066 (2nd)", "objectName": "POL904_015413", "instance": "3101066", "occupancy": "Occupied", "schedule": "None", "ignore": "False", "commStatus": "None", "alarmStatus": "Active", "macaddress": "66", "directSchedule": "False", "rogueZone": "False", "deviceType": ["AirSource"] }] }; $scope.titles = data.deviceList; // mocked, replace with real $http.get /* // this is the correct way $http.get('devices.json').then(function successCallback(response) { console.log("API call works!"); console.dir(response.data.deviceList); $scope.titles = response.data.deviceList; }, function errorCallback(response) { // error callback goes here console.log("API call doesn't work"); }); */ }); // <-- removed error call back from here
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="mainApp" ng-controller="mainScripts"> <!-- moved controller here! --> <div class="tile draggable" ng-repeat="stuff in titles"> <!-- removed controller from here --> <ul> <li>{{stuff.location}}</li> <li>{{stuff.description}}</li> </ul> </div> </div>