我已经阅读了关于这个特定主题的更多教程和帖子,而不是我承认但我仍然无法找到解决方案。我需要在链接的promise返回后刷新视图,该命令返回绑定到$ scope.p.devices。我已经尝试禁用缓存视图(仍然禁用)和许多其他解决方案。希望有人在这里指出我正确的方向。
HTML: 设备清单
<md-card>
<ion-content>
<div class="card-content">
<div class="device-content-detail"
collection-repeat="device in p.devices"
collection-item-height="136px"
collection-item-width="100%">
<div class="card-content">
<h1 class="md-title">
<span>
<i class="fa fa-crosshairs" aria-hidden="true"></i>
Device List
</span>
</h1>
{{device.name}}
</div>
</div>
</ion-content>
</md-card>
<md-list>
<md-card ng-if="!isAnimated" class="card-item" ng-repeat="device in p.devices track by $index">
<md-card-content>
<div class="card-content">
<h1 class="md-title">
<span>
Device List
<i class="fa fa-crosshairs" aria-hidden="true"></i>{{device.name}}
</span>
</h1>
<div class="device-content-detail">
<i class="fa fa-wifi" aria-hidden="true"></i>{{device.connected}}
<i class="fa fa-heartbeat" aria-hidden="true"></i>{{device.last_heard}}
</div>
</div>
</md-card-content>
</md-card>
控制器:
appControllers.controller('devicesCtrl', function ($scope,$state,$stateParams,$timeout,$mdDialog,$ionicHistory,$ionicLoading,particle,pDevices,safeparse) {
//$scope.isAnimated is the variable that use for receive object data from state params.
//For enable/disable row animation.
var debug = true;
$ionicLoading.show({
content: 'Getting Devices',
animation: 'fade-in',
showBackdrop: true,
maxWidth: 200,
showDelay: 0
});
$timeout(function () {
pDevices.getpDevices().then(function(data) {
$scope.p.devices = data;
if (debug) console.log(debug + 'time out got particle.io device list: ', $scope.p.devices);
$scope.isLoading = false;
if (debug) console.log(debug + 'time out complete, hiding ionicLoading: ');
$ionicLoading.hide();
}, function() {
$scope.p.showAlertDialog($event);
$scope.error = 'unable to load devices'
});
}, 2000);
$scope.initialForm = function () {
//$scope.isLoading is the variable that use for check statue of process.
$scope.isLoading = true;
$scope.isAnimated = $stateParams.isAnimated;
};// End initialForm.
$scope.$watch('p.devices', function (newVal, oldVal){
console.log(newVal, oldVal)
});
$scope.p = {
currentDevice: '',
deviceId: particle.setDevice(),
token: particle.setToken(),
devices: [],
getDevices: function () {
pDevices.getpDevices().then(function(deviceList) {
if (debug) console.log(debug + 'getDevices got particle.io device list: ', deviceList);
$scope.p.devices = deviceList.data;
});
},
// Select the current device for particle platform
setDevice: function (deviceId) {
if (deviceId) {
if (debug) console.log(debug + 'setDevice', deviceId);
$scope.p.deviceId = deviceId;
particle.setDevice(deviceId);
$scope.startup();
}
return $scope.p.deviceId;
}
};
showAlertDialog = function ($event) {
$mdDialog.show({
controller: 'DialogController',
templateUrl: 'confirm-dialog.html',
targetEvent: $event,
locals: {
displayOption: {
title: "No Devices Found.",
content: "Unable to load Device List.",
ok: "Confirm"
}
}
}).then(function () {
$scope.dialogResult = "You choose Confirm!"
});
}// End showAlertDialog.
$scope.initialForm();
});// End of controller Device.
最后工厂被召唤:
appServices.factory('pDevices', function($http, localstorage) {
root_url = 'https://api.particle.io/v1/'
var getpDevices = function() {
return $http.get(root_url + 'devices').then(function(response){
console.log('pDevices getpDevices: ', response.data);
return response.data;
});
};
return {
getpDevices: getpDevices
};
});