我有一个 cordova 应用程序,我想在其中显示位置的详细信息。出于某种原因,当我尝试在 HTMl 中显示一个在 JS 中成功分配的变量时,什么也没有出现。
JS Controller :
app.controller('placeCtrl', function($scope, LocDat){
LocDat.async().then(function(d){
$scope.item= places.selectedItem;
$scope.locs = [];
for(var i=0; i<d.length; i++){
if(d[i].attributes.Joint.id === places.selectedItem.id){
getDistance(d[i]);
$scope.locs.push(d[i]);
}
}
$scope.showSite = function(){
//var ref = navigator.app.loadUrl($scope.item.attributes.Website, '_blank');
var ref = window.open($scope.item.attributes.Website,'_blank','location=yes');
}
$scope.showDetail = function(index){
var selectedItem = d[index];
d.selectedItem = selectedItem
$scope.l = selectedItem;
console.log($scope.l.attributes.City);
$scope.ons.navigator.pushPage('location_detail.html', { title : d.selectedItem.attributes.Address });
}
});
HTML:
<!DOCTYPE html>
<html>
<body>
<div ng-controller="placeCtrl">
<ons-page class="center" ng-device-backbutton="myNavigator.popPage()">
<ons-toolbar>
<div class="left"><ons-back-button ons-if-platform="ios">Back</ons-back-button></div>
<div id="title" class="center">{{l.attributes.City}}, {{l.attributes.State}}</div>
<!--<div class="left" onclick=".myNavigator.popPage()"><ons-back-button>Back</ons-back-button></div>-->
<!--<div class="center">Page 2</div>-->
</ons-toolbar>
<h2 align="center">Location Details Go Here</h2>
<!--enter more content here-->
</ons-page>
</div>
</body>
</html>
控制台输出图像:
显然我的声誉太低,无法发布图片...认真的吗?无论如何,它在控制台中成功显示城市名称,但 html 仅显示逗号
最佳答案
进行异步调用的服务(例如您的 LocDat)在返回时不会自动触发摘要事件。如果你正在编写一个服务,它应该调用链接到 promise 末尾的 $scope.$apply() 。或者,您可以将对 $scope 变量的任何更改包装在 apply 中,这应该可以让您到达所需的位置。
$scope.$apply( function() { $scope.l = selectedItem; } );
关于javascript - Angular $scope 没有在 HTML 中显示正确的数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28179677/