我试图通过$ http()调用向视图显示JSON数据。我收回了我的数据,然而,ng-repeat没有正确显示我的数据。我收到一个控制台错误,指出“错误:$ digest已在进行中”。
另一个注意事项是getRoundDetails()函数是在上一个视图提交的addRound()中调用的。
我使用Angular相对较新,从未见过$ digest参考。请帮忙。
这是我的controller.js:
statTrackerApp.controller('roundController',
function($scope, $http, $window, $route) {
$scope.newRound = {};
$scope.savedRound = {};
$scope.roundDetails = []; //I have tried {} as well with no success
$scope.facilities = {};
$scope.courses = {};
$scope.tees = {};
$scope.holes = {};
...
$scope.addRound = function () {
$http.post("/api/round/", $scope.newRound)
.then(function (result) {
// Successful
//angular.copy(result.data, $scope.facilities);
//$window.location = "#/facilities";
$scope.savedRound = result.data;
$scope.getRoundDetails();
$window.location.href = '#/roundDetail';
},
function () {
// Error
alert("Could not save new round");
});
};
$scope.getRoundDetails = function () {
$http.get("/api/roundDetail/" + $scope.savedRound.roundId)
.then(function (result) {
// Successful
//angular.copy(result.data, $scope.roundDetails);
$scope.roundDetails = result.data;
},
function () {
// Error
alert("Could not load round details.");
});
};
});
这是我的2个视图包装器:
<form class="form-horizontal" role="form" ng-submit="addRoundDetails()" ng-controller="roundController">
<div ng-include="'app/partials/_roundDetails-form.html'"></div>
</form>
<form class="form-horizontal" role="form" ng-submit="addRound()" ng-controller="roundController">
<div ng-include="'app/partials/_round-form.html'"></div>
</form>
这是_roundDetails-form.html:
<div class="form-group">
<h2>Round Details</h2>
<div class="col-sm-10">
<div>
<ul class="thumbnails">
<li ng-repeat="roundDetail in roundDetails">
{{roundDetail.roundDetailId}}
</li>
</ul>
</div>
</div>
</div>
这是_round-form.html:
<div class="form-group">
<h2>Round</h2>
<div class="col-sm-10">
<table>
<tr>
<td><label for="facility" class="col-sm-2 control-label">Facility: </label></td>
<td><select ng-change="getCourses(newRound.facilityId)" ng-model="newRound.facilityId" class="form-control" id="facility" required="required">
<option ng-repeat="facility in facilities" value="{{facility.facilityId}}">{{facility.name}}</option>
</select><br /></td>
</tr>
<tr>
<td><label for="course" class="col-sm-2 control-label">Course: </label></td>
<td><select ng-change="getTees(newRound.courseId)" ng-model="newRound.courseId" class="form-control" id="course" required="required">
<option ng-repeat="course in courses" value="{{course.courseId}}">{{course.name}}</option>
</select><br /></td>
</tr>
<tr>
<td><label for="tee" class="col-sm-2 control-label">Tees: </label></td>
<td><select ng-model="newRound.teeId" class="form-control" id="tee" required="required">
<option ng-repeat="tee in tees" value="{{tee.teeId}}">{{tee.name}}</option>
</select><br /></td>
</tr>
<tr>
<td><label for="date" class="col-sm-2 control-label">Date: </label></td>
<td><input type="date" ng-model="newRound.date" class="form-control" id="date" required="required" placeholder="Enter date." /></td>
</tr>
<tr>
<td><label for="official" class="col-sm-2 control-label">Is Official: </label></td>
<td><input type="checkbox" ng-model="newRound.isOfficial" class="form-control" id="official" /><br /></td>
</tr>
<tr>
<td><label for="holes" class="col-sm-2 control-label">Holes: </label></td>
<td><input type="checkbox" ng-model="newRound.holes" class="form-control" id="holes" /><br /></td>
</tr>
<tr>
<td><label for="hbh" class="col-sm-2 control-label">Hole by Hole: </label></td>
<td><input type="checkbox" ng-model="newRound.hbh" class="form-control" id="hbh" /><br /></td>
</tr>
<tr>
<td><label for="score" class="col-sm-2 control-label">Total Score: </label></td>
<td><input type="text" ng-model="newRound.TotalScore" class="form-control" id="score" value="0" /></td>
</tr>
<tr></tr>
<tr>
<td>
</td>
<td>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<input ng-click="getHoles(newRound.teeId)" type="submit" class="btn btn-primary" value="Save Round" />
</div>
</div>
</td>
</tr>
</table>
</div>
</div>