我正在客户端上使用 Angular 开发应用程序。该应用程序有一组可以重新排序的幻灯片,如下所示:
<div ng-controller="SortableCTRL">
<ul id="sortable">
<li ng-repeat="item in sortableArray" ng-bind="item"></li>
</ul>
<button ng-click="add()">Add</button>
<hr>
<pre ng-bind="sortableArray|json"></pre>
</div>
Run Code Online (Sandbox Code Playgroud)
js:
$scope.sortableArray = [
'One', 'Two', 'Three'
];
$scope.add = function() {
$scope.sortableArray.push('Item: '+$scope.sortableArray.length);
sortableEle.refresh();
}
$scope.dragStart = function(e, ui) {
ui.item.data('start', ui.item.index());
}
$scope.dragEnd = function(e, ui) {
var start = ui.item.data('start'),
end = ui.item.index();
$scope.sortableArray.splice(end, 0,
$scope.sortableArray.splice(start, 1)[0]);
$scope.$apply();
}
sortableEle = $('#sortable').sortable({
start: $scope.dragStart,
update: $scope.dragEnd
});
}
Run Code Online (Sandbox Code Playgroud)
http://jsfiddle.net/dj_straycat/Q5FWt/3/
该应用程序可由多人访问,因此,在添加/重新排序幻灯片时推送通知会很有用。在搜索时,我发现 socket.io 是正确的方法;但是我工作的公司还没有批准socket.io。有没有办法在不使用 socket.io 的情况下做到这一点?