【问题标题】:DOM not updating after POSTPOST 后 DOM 未更新
【发布时间】:2015-10-05 14:00:10
【问题描述】:

在我的 Django+angular 应用程序中使用 https://github.com/blacklocus/angular-django-rest-resource 和我的 ng-repeat 在发出“DELETE”请求时正确更新,但不使用“POST”

相关控制器代码:

var Project = djResource('api/projects/:id', {'id': "@id"});
$scope.projects = Project.query();
$scope.newProject = new Project;
$scope.createProject = function(){
  apiSrv.request('POST', 'projects/', $scope.newProject,
   function(data){
    $scope.projects = Project.query();
   },
   function(err){
    $log.error(err);
   }
  );
};
$scope.deleteProject = function(id){
  apiSrv.request('DELETE', 'projects/'+id, {},
   function(data){
    $scope.projects = Project.query();
   },
   function(err){
    $log.error(err);
   }
  );
};

相关服务代码:

.factory('apiSrv', ['$http', function($http){
  var apiSrv = {};

  apiSrv.request = function(method, url, args, successFn, errorFn){
    return $http({
      method: method,
      url: '/api/' + url,
      data: JSON.stringify(args)
    }).success(successFn).error(errorFn);
  };

  return apiSrv;
}]);

我尝试在 POST 回调期间调用 $scope.$apply();。也试过$scope.projects.push(project);

我也试过了

$scope.newProject.$save(function(data){
  $scope.projects = Project.query();
});

与 $save 回调中的 $scope.projects.push(project);$scope.$apply(); 一起,我没有尝试更新 DOM。它在deleteProject 函数中运行良好,DOM 更新以显示 $scope.projects 的更新状态。添加$log.info($scope.projects); 列出了所有新添加的项目,但同样,无论我做什么,DOM 都保持不变。有任何想法吗?谢谢。

【问题讨论】:

  • 如果您的问题是关于 DOM 的,那么发布相关的 HTML 并不是最糟糕的主意。
  • @zeroflagL 相关的HTML就是<md-list-item ng-repeat="project in projects" class="project md-no-proxy ng-scope" role="listitem">
  • 旁注,你为什么停止使用 Promise 而决定使用 successFn/errorFn 回调?
  • @MathewBerg 呃,我不知道。两者有很大区别吗?
  • 一般情况下你会坚持一个,尽量不要混用。我个人更喜欢承诺,因为它传递的东西更少。这只是一个观察:)

标签: angularjs django ngresource


【解决方案1】:

终于解决了这个问题。我正在使用 Angular Material,我的项目表单位于一个材质对话框中,该对话框显然创建了一个隔离范围。我需要将当前范围指定为对话框的属性,然后通过该属性引用模型。

例如

$mdDialog.show({
    controller: function(){this.parent = $scope;},
    controllerAs: 'ctrl',
    ...

在我看来使用ng-model: "ctrl.parent.newProject.project_name"等等。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2017-11-27
    • 1970-01-01
    • 1970-01-01
    • 2018-06-17
    • 2020-05-03
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多