使用angularjs和php（后端）的可更新网格

Question

我必须像这样创建一个可更新的网格。

用户将编辑此网格，更新的信息将异步保存到db。由于多个用户在同一网格上工作，当其他用户更新特定列时，更改应反映给所有用户。

我是angularjs的新手。我如何在php中使用带有后端的angularjs来实现这个功能。

Answer 1

您的问题似乎比仅使用AngularJS更新网格更大，因此需要考虑以下几点：

多个用户的通信

您可能希望使用WebSockets来跨多个客户端提供实时通信。在php端，您可以使用Ratchet之类的东西来提供WebSockets，在客户端使用angular-websocket与它们进行交互。客户端部分看起来像

WebSocket.onmessage(function(event) {
  // update the state
});

如果情况太多，您可以使用ajax从服务器轮询网格状态并提供伪实时通信。这可能看起来像

$interval($http.get('your url').success(function(result) {
  // update the state
}), 30 * 1000) // polls every 30 seconds

但是，我真的建议深入研究WebSockets - 它们就是你想要的。

网格本身

使用WebSockets或ajax民意调查更新状态后，您可以拥有一个完全灵活的二维网格，如下所示：

// the controller
.controller('GridCtrl', function($scope, WebSocket) {
  WebSocket.onmessage(function(event) {
    $scope.grid = event.data;
  });
  $scope.updateGrid = function() {
    WebSocket.send($scope.grid);
  });
})

<!-- the template -->
<form ng-submit="updateGrid()">
  <div class="row" ng-repeat="row in grid">
    <div class="col" ng-repeat="col in row">
      <input ng-model="col">
    </div>
  </div>
</form>