Javascript 角度表问题_Javascript_Angularjs

Javascript 角度表问题

javascript angularjs

Javascript 角度表问题,javascript,angularjs,Javascript,Angularjs,这是我第一次使用Angular的手表功能，显然我没有让它工作。我有一个名为apiService的服务，它有一个变量myFile。我正在将服务注入我的控制器，并希望观察apiService.myFile值的变化。不幸的是，只在打开网页时调用watch，而不是在apiService.myFile变量实际更改时调用。以下是手表的代码： $scope.$watch(function(){return apiService.myFile}, function (newVal, oldVal, scope

这是我第一次使用Angular的手表功能，显然我没有让它工作。我有一个名为

apiService

的服务，它有一个变量

myFile

。我正在将服务注入我的控制器，并希望观察

apiService.myFile

值的变化。不幸的是，只在打开网页时调用watch，而不是在

apiService.myFile

变量实际更改时调用。以下是手表的代码：

$scope.$watch(function(){return apiService.myFile}, function (newVal, oldVal, scope) {
    console.log("service changed: "+newVal +" : "+oldVal+" : "+ scope);
});

当

myFile

更改时，为什么不调用它

更新1：这就是我在服务中更新

apiService.myFile

值的方法

ApiService.prototype.uploadFile = function(fileContent) {
    $.ajax({
        url: "/space_uploadFile/",
        type: "POST",
        dataType: "json",
        data: {
            fileContent: fileContent
        },

        contentType: "application/json",
        cache: false,
        timeout: 5000,
        complete: function() {
          //called when complete
          console.log('process complete');
        },
        success: function(data) {
            this.myFile =data;
            console.log("this.myFile: "+this.myFile);
            console.log('process success');
       },
        error: function() {
          console.log('process error');
        },
      });

};

我习惯了这种语法：

scope.$watch('name', function(newValue, oldValue) {
  scope.counter = scope.counter + 1;
});

其中name是您的财产名称-在本例中，

myFile

我将其添加到了一个plunkr中（您没有），这对我很有用：

旁注：下次创建一个示例来演示您的问题（plunkr），这样我们就可以消除您的问题（例如拼写错误）

以及相应的HTML：

<body ng-controller="mainController">
  <h1>Hello Plunker!</h1>
  {{someValue}}
  <button ng-click="changeValue()">Click</button>
</body>

Edit2：OP显然也在控制器上的succeshandler to acces变量中使用了

此

。这行不通，所以我在上面的示例中使用了self模式来解决它。

尝试在deepwatch的末尾添加

true

，true）您的“apiService.myFile”的数据类型是什么？@cjmling添加true没有help@JackPu它是从ajax请求返回的字符串。您是否尝试直接使用该值？这仅适用于作用域上的属性。OP不想要这个。他想看一个服务的属性。那么它可能是一个副本：所以答案不是使用角度表而是其他东西？实际上你可以使用$watch。角度表是为在摘要期间观察属性的变化而设计的。它根本不是为服务而设计的。我的建议是自己在服务中实现一个观察者模式。这也是链接的答案所暗示的。如果它只是对你有效，那么我的控制器就出了问题。这可能是因为我在服务原型中调用了ajax吗<代码>ApiService.prototype.uploadFile=函数（fileContent）{$.ajax（{…]）；}；使用$http而不是$.ajax。因为您使用$.ajax离开Angular上下文，因此在成功句柄中发生的更改不会触发Angular的摘要周期。我添加了如何在服务中实际更改变量的代码，更新了我的答案。我必须使用此代码。$http.post否则找不到$http。并且恩，它仍然只是在pageload上触发手表，而不是在变量改变时

<body ng-controller="mainController">
  <h1>Hello Plunker!</h1>
  {{someValue}}
  <button ng-click="changeValue()">Click</button>
</body>

var self = this;
self.$http.post("/space_uploadFile/",
{ fileContent: fileContent },
{ 
    cache: false,
    timeout: 5000
})
.then(function (data) {
    self.myFile = data;
    console.log("self.myFile: " + self.myFile);
    console.log('process success');
},
function () {
    console.log('process error');
});