JavaScript未更新$scope变量的一部分

JavaScript not updating part of $scope variable

本文关键字：变量 一部分 scope 更新 JavaScript      更新时间：2024-07-04

作为参考，我为API调用使用带有Restangular的MEAN堆栈。

post.tags变量是我的脚本应该更新的字符串数组（以及对象的其余部分）。问题是，tags变量没有更新，而post对象中的其他变量没有问题。

我将数组连接到一个字符串中，以便在更新之前可以在视图中轻松修改它，但我怀疑这一行也是导致它无法正确更新的原因。我插入了一个控制台日志，以验证当我单击视图中的保存按钮时$scope.tags是否没有更新。视图中的一个小的双向绑定还显示，它确实会在按下save之前进行更新，但一旦按下该按钮，它就会恢复到原始值。

这似乎是一个微不足道的问题，但我很难找到解决方案。如有任何帮助，我们将不胜感激。

post-edit.js

.controller('PostEditCtrl', function ($scope, $location, $routeParams, Post) {       
  $scope.editPost = true;
  $scope.post = {};
  Post.one($routeParams.id).get().then(function(post) {
    $scope.post = post;
    $scope.tags = $scope.post.tags.join();
    $scope.savePost = function() {
      $scope.post.tags = $scope.tags.replace(/['s]/g, '').split(',');
      console.log($scope.tags);
      $scope.post.save().then(function() {
        $location.path('/post/' + $routeParams.id);
      });
    };
  });
});

post-edit.html

...
<div class="form-group">
  <label for="content" class="control-label">Tags</label>
  <input type="text" ng-model="tags" class="form-control" id="tags" placeholder="Enter a comma separated list of tags">
  <p>{{tags}}</p>
</div>
...

通过根本不使用临时变量$scope.tags而只使用$scope.post.tags解决了我的问题。最终JS文件如下：

post-edit.js

.controller('PostEditCtrl', function ($scope, $location, $routeParams, Post) {       
  $scope.editPost = true;
  $scope.post = {};
  Post.one($routeParams.id).get().then(function(post) {
    $scope.post = post;
    $scope.post.tags = $scope.post.tags.join();
    $scope.savePost = function() {
      $scope.post.tags = $scope.post.tags.replace(/['s]/g, '').split(',');
      $scope.post.save().then(function() {
        $location.path('/post/' + $routeParams.id);
      });
    };
  });
});
相关文章：