Question

请帮忙！我把头发拉过来。我已经为此尝试了很多教程，但似乎无法让任何东西工作，甚至远程工作。

用户可以在页面上添加/删除/更新用户信息，我希望它们在执行其中一个操作时进行刷新。所有的操作都写得很好，我已经取得了不同的成功，但是我无法让视图实时更新。

我无法使用$ scope。$ apply（）; $ digest已在进行中。我觉得我只缺少一些重要的钥匙。

服务

angular.module('userlistFactory', [])
    .service('Data', function($http){
        this.list = function(){
            return $http.get('.../getUsers.php', {cache: true})  
            .then(function(data){
                return data.data;
            });
        }

控制器

userlistControllers.controller('UserListCtrl', ['$scope', 'Data', function ($scope, Data){

  Data.list().then(function (data) {   // Populates the page the first time through
    $scope.users = data;
  })

  $scope.$watch('Data.list()', function(newValue){  // At this point, I don't understand
    $scope.users = newValue;
  }, true);

查看

<tr ng-repeat-start="user in users| filter:query | orderBy:'id'">
    <td><a href="#/profile/{{user.id}}">{{user.id}}</a></td>
    <td>{{user.firstname}}</td>  // etc...

感谢阅读。

Answer 1

当您返回$ http对象并在范围内设置回调时，除非您想要处理.fail（）或进行进一步处理，否则无需在服务中处理回调。它甚至可能是造成错误的回报。

angular.module('userlistFactory', [])
.service('Data', function($http){
    this.list = function(){
        return $http.get('.../getUsers.php', {cache: true});
        }
    });

您接到用户的电话会看起来不错，但只会运行一次。如果要在DB更改后调用它进行更新，则需要将其放入方法

    function UpdateUsers(){         
      Data.list().then(function (data) {
         $scope.users = data;
         $scope.$apply();  //Because it was asynch
      });
    }

你可以摆脱$ watch部分。

现在，当您的用户添加，删除等时，您只需调用更新用户方法，即可启动同步请求。当它返回时，$ scope.users将被更新，$ scope。$ apply（）将调用摘要周期来更新你的页面。

当然，您希望您的列表立即更新，就像您在评论中一样。为此，只需在控制器中调用该方法即可。

    UpdateUsers();

$ http对象看起来有点令人困惑。你正在返回对象并添加.then（....你正在注册你的回调。大多数代码示例一次显示所有$ http（...）。然后（...）但在你的情况下，你在你的服务中创建它并返回你在你的控制器上注册你的回调的对象。$ http ----＆gt;回到控制器添加.then（..）所以你不需要处理它这两个地方。你可以如何处理.fail（......如果你需要处理它，你也可以在任何地方处理。

消除对$ watch的一些困惑。 Angular只关心事物的约束。如果我有一个没有在任何地方使用过的值，但是如果它发生变化我想要做一些事情，那么我需要再观察它是否有变化。那是因为没有事件或任何东西可以触发代码。添加$ watch是在绑定到某个东西时自动完成的，因为它会在摘要周期中监视它，以便它可以更新它需要更新的内容。

数据库插入后，Angularjs通过$ http.get服务刷新视图

1 个答案: