我一直在研究这个问题一个星期,并在Angular文档和StackOverflow中搜索答案,但我找不到解决方案。如问题所示,模型在所有设备中都会更新,但相应的视图不会在手机上更新。我在我的iphone上使用了开发工具,并且可以在控制台中看到相关信息正在传递到数据库并存储,但是相应的视图不会像我在笔记本电脑上那样出现。我已经检查了其他移动设备,其他笔记本电脑和各种浏览器,我相信这个问题已经被移动隔离了。我使用Node.js / sails.js作为我的服务器,使用MongoDB作为我的数据库。
提供更具体的上下文:我的应用程序使用采用用户输入的模式表单。提交表单后,将进行AJAX调用,然后创建媒体 - 地图,时间轴,评论。视图在原始$ modal.open函数的回调函数中刷新。
以下是一些代码段。下面的第一个函数打开模态 - 注意查询数据库并提供更新视图的新数据的回调:
$scope.newMap = function() {
$modal.open({
templateUrl:'/views/maps/addMapModal.html',
controller: 'AddMapModalCtrl'
}).result.then(function(){
Project.get({id: $routeParams.id}, function(data) {
console.log(data.maps[0].id)
$scope.project = data
});
});
}
第二个函数是模态控制器,并在我的数据库中创建新的映射实例:
$scope.addMap = function() {
var zoom
var theme
if($scope.zoom) {
if ($scope.zoom === "Neighborhood") {
zoom = 14
} else if ($scope.zoom === "City") {
zoom = 10
} else if ($scope.zoom === "Region") {
zoom = 8
} else if ($scope.zoom === "Country") {
zoom = 5
} else if ($scope.zoom === "Continent") {
zoom = 4
} else if ($scope.zoom === "World") {
zoom = 2
} else {
alert("Please choose either Neighborhood, City, Region, Country, Continent or World")
}
}
if($scope.theme) {
if ($scope.theme === "18th Century") {
theme = tilesDict.mapbox_pirates
}
else if ($scope.theme === "Grayscale") {
theme = tilesDict.mapbox_light
}
else if ($scope.theme === "Physical Features") {
theme = tilesDict.mapbox_outdoors
}
else {
theme = tilesDict.openstreetmap
}
}
var map = new AddMap()
map.name = $scope.name;
map.description = $scope.description
map.country = $scope.country;
map.city = $scope.city;
map.zoom = zoom;
map.theme = theme;
map.$save({projectId: $scope.project.id}, function(data) {
console.log('map created')
console.log(data)
$scope.project = data;
$modalInstance.close();
})
}
如上所述,我知道数据库实例是使用我的iPhone上的开发工具创建的,但也因为我的笔记本电脑上的新地图信息一旦输入我的手机就显示出来了。我尝试了各种修复 - 例如,包括ngTouch,将$ modal.open回调包装在$ watch和$ scope。$ apply函数中 - 但没有任何效果。我希望有人能够为我提供一些额外的见解。谢谢!