【发布时间】:2018-11-05 22:22:46
【问题描述】:
我想在AngularJS $http.get() 调用之后动态显示REST 响应数据。答案很好 数据绑定{{showOrderStateTrigger}} 和{{orderDetails}} 在调用显示true 和预期内容之后插入仅用于测试目的。但是ng-show 和ng-hide 并没有意识到他们的情况发生了变化。我创建了ng-show 和ng-hide 案例只是为了测试两种方法。检查变量undefined 或布尔变量状态。我尝试了$scope.$apply() 电话,但这只会让事情变得更糟。嵌套调用导致异常。谁能帮我解决这个问题?
<script type="text/javascript">
var myApp = angular.module( "myApp", [] );
myApp.controller( "myController", function( $scope, $http )
{
$scope.showOrderDetailsTrigger = false;
$scope.showOrderDetails = function ( id )
{
$http.get( "/WebApplication1/orders/" + id + ".json" )
.then( function ( response ) {
$scope.orderDetails = response.data;
$scope.showOrderDetailsTrigger = true; } );
}
} )
</script>
</head>
<body ng-app="myApp" ng-controller="myController">
<ul>
<c:forEach var="order" items="${orders}">
<li ng-click="showOrderDetails( ${order.id} )">${order.name}</li>
</c:forEach>
</ul>
<div>{{showOrderDetailsTrigger}}</div>
<div>{{orderDetails}}</div>
<div ng-show="{{showOrderDetailsTrigger}}">
<div>ID: {{orderDetails.id}}</div>
<div>Name: {{orderDetails.name}}</div>
</div>
<div ng-hide="{{orderDetails === undefined}}">
<div>ID: {{orderDetails.id}}</div>
<div>Name: {{orderDetails.name}}</div>
</div>
</body>
</html>
【问题讨论】:
标签: javascript angularjs