我在尝试重新渲染表的模型时遇到一些问题,当我更新此表内的项目时,调用将编辑该项的http api,然后,当执行回调时,它将调用同样的api获取刷新的项目列表,实际上它工作正常,但唯一的问题是没有使用新信息刷新表。
据我所知,http请求负责$ apply,但它有点混淆
这里我的表格中我对列表中的每个项目都有一个ng-repeat:
<table cellspacing="0" class="table table-small-font table-bordered table-striped">
<thead>
<tr>
<th data-i18n="_maintainer_devices_table_devices_column_code"></th>
<th data-i18n="_maintainer_devices_table_devices_column_type"></th>
<th data-i18n="_maintainer_devices_table_devices_column_status"></th>
<th data-i18n="_maintainer_devices_table_devices_column_action"></th>
</tr>
</thead>
<tbody class="middle-align">
<tr ng-repeat="(key, value) in devicesList">
<td>{{value.code}}</td>
<td>{{value.type.name}}</td>
<td>{{value.status.name}}</td>
<td ng-controller="UIModalsCtrl">
<button class="btn btn-icon btn-white btn-xs">
<i class="fa fa-truck"></i>
</button>
<button class="btn btn-icon btn-white btn-xs" ng-click="openModal('maintainer_modal', 'md','',{'title': 'Edit','action': 'edit'},value);" tooltip="Tooltip on bottom" tooltip-placement="bottom">
<i class=" fa fa-pencil"></i>
</button>
<button class="btn btn-red btn-icon btn-icon-standalone btn-xs" ng-click="openModal('confirm_modal', 'md','',{'title': 'Delete','action': 'delete'},value);">
<i class="fa fa-trash-o"></i>
<span data-i18n="_button_delete"></span>
</button>
</td>
</tr>
</tbody>
</table>
deviceService.js
traceItServices.service('$deviceMaintainer', function($http) {
var call = function(data, action, callback) {
var url = 'http://171.16.0.4:1337/maintainer/devices/' + action;
showLoadingBar({
pct: 100,
delay: 1,
before: function(pct) {
$http.post(url, data).success(function(data, status, headers, config) {
callback(data);
});
}
});
};
this.get = function(data, callback) {
call(data, 'get', function(data) {
callback(data);
});
}
this.update = function(data, callback) {
call(data, 'update', function(data) {
callback(data);
});
}
...
deviceController.js
traceitApp.controller('devicesCtrl', ['$scope', '$rootScope', '$http', '$timeout', '$messages', '$deviceMaintainer', '$translator',
function($scope, $rootScope, $http, $timeout, $messages, $deviceMaintainer, $translator) {
.......
$scope.getUserDevices = function() {
var data = {
user_id: $rootScope.userInfo.userId
};
$deviceMaintainer.get(data, function(dataOut) {
var list = JSON.parse(dataOut.response).devices.device;
list = $translator.translateDevicesList(list);
$timeout(function() {
$scope.devicesList = list;
}, 1)
});
};
$scope.updateDevice = function() {
var data = {
device_code: $scope.device_code,
device_type_id: $scope.device_type_id,
device_id: $scope.device_id
};
$deviceMaintainer.update(data, function(dataOut) {
try {
var res = JSON.parse(dataOut.response);
if (res.result.id > 0) {
$messages.success($translator.localize.getLocalizedString('_message_success'));
}
$scope.getUserDevices();
} catch (e) {
console.log(e.message);
}
});
};
}
]);
提前致谢。
答案 0 :(得分:0)
实际上,你甚至使用$ timeout。 根据{{3}},这也会在当前摘要之后触发$ apply。
所以,渲染效果很好。你确定,你真的有新数据吗? 我猜你已经调试了回调。
答案 1 :(得分:0)
我发现,我正在使用 $ scope.devicesList = list 并且由于某种原因它没有更新它,但相反,我使用 $ rootScope.devicesList = list并且突然,它工作..现在当我改变任何东西并更新时,它刷新...... < / p>
谢谢你们=)
<强>更新强>
我弄清楚为什么它不工作,事情是,我从一个模态调用deviceCtrl-&gt;更新,而模态是,所以,这个对话框有不同的deviceCtrl范围,所以当我更新列表,它没有改变,因为它不在同一范围内,所以,为了解决它,我不得不在模态控制器中添加一个变量,包含它的父级。
var parent = $ scope。$ parent; (在模态控制器中注入$ scope)。
这样父级将成为deviceCtrl的原始范围。
所以修好它,很难想象,阅读和阅读我想出了这个。谢谢大家。