使用错误的“这个”范围AngularJS HTTP服务功能成功(AngularJS service

2019-08-17 00:19发布

一个成功的功能$http.put没有进入this它被称为内部的服务范围。 我需要在呼叫从PUT请求重新更新服务的属性。

这是我想要的服务做了削减例如:

var myApp = angular.module('myApp', function($routeProvider) {
// route provider stuff
}).service('CatalogueService', function($rootScope, $http) {
    // create an array as part of my catalogue
    this.items = [];

    // make a call to get some data for the catalogue
    this.add = function(id) {
        $http.put(
            $rootScope.apiURL,
            {id:id}
        ).success(function(data,status,headers,config) {
             // on success push the data to the catalogue
             // when I try to access "this" - it treats it as the window
             this.items.push(data);
        }).success(function(data,status,headers,config) {
            alert(data);
        });
    }
}

很抱歉,如果有在JS的一些错误,主要问题是如何从成功回调中访问该服务范围是什么?

编辑 :而这个问题的答案是正确的,我切换到factory方法既Josh和马克它推荐

Answer 1:

创建了一个变量(通常称为闭合that )分配给this让您的回调函数可以访问你的服务对象:

app.service('CatalogueService', function($rootScope, $http) {
    var that = this;
    ...
        ).success(function(data,status,headers,config) {
          that.items.push(data);

这里是一个Plunker使用$超时,而不是$ HTTP来证明。



Answer 2:

据我所知,你不能。 但我不会尝试这样想运行的服务。 这里是一个更清洁的方式:

.factory('CatalogueService', function($rootScope, $http) {
  // We first define a private API for our service.

  // Private vars.
  var items = [];

  // Private methods.
  function add( id ) {
    $http.put( $rootScope.apiURL, {id:id} )
    .success(function(data,status,headers,config) { items.push(data); })
    .then(function(response) { console.log(response.data); });
  }

  function store( obj ) {
    // do stuff
  }

  function remove( obj ) {
    // do stuff
  }

  // We now return a public API for our service.
  return {
    add: add,
    store: store,
    rm: remove
  };
};

这是发展中AngularJS服务的一个很常见的模式,它不需要任何使用this在这些情况下。



文章来源: AngularJS service http success function using wrong “this” scope