从两个地方调用的AngularJs Service返回相同的值

时间:2017-12-10 22:25:39

标签: angularjs angularjs-service

我是新手,如果有的话,请原谅我的无知。我正在尝试创建一个简单的服务,它将获得功能并将数据提供给数组。 我遇到的问题是,我没做什么 - 我总是得到相同的数据我通过的任何参数。

这是我的示例服务

function myService($http, $q) {
    var service = {
        getSomeData: getSomeData:

    };
    var def = $q.defer();

    return service;

    function getSomeData(category) {


        if (category === 'books') {
            url = 'http://www.someurl1';
        } else {
            url = 'http://www.someurl2'
        };

        $http.get(url, {
            params: {
                'type': category
            }

        }).success(function(data) {
            def.resolve(data);
        }).error(function() {
            def.reject('Failed to get data');
        });
        return def.promise;
    }
}

})();

有了这个,在我的控制器中,我试图将其称为样本用途,如此

$scope.someData = [] ;
$scope.someData.push(myService.getSomeData('DVDs'); 
$scope.someData.push(myService.getSomeData('books');

现在,当我看到我的$ scope.someData时, 我有一个由两个对象组成的数组 - 问题是它们总是相同的,并且没有特定于书籍和DVD的数据。

我遇到的另一个小问题是我的对象someData有

  

数组 - >承诺 - > $$ state - >值

然后有实际数据。我怎样才能直接得到数据。 我试过返回def.promise(data);

1 个答案:

答案 0 :(得分:3)

一个问题是你只在<!DOCTYPE! html> <html> <head> <style> body, html { margin-top: -11px; margin: 0; height: 100%; min-width: 1000px; background-color: red; } .bg { margin-left: 20%; width: 60%; background-color: grey; border-left: thick solid black; border-right: thick solid black; } .background { background-image: url("images/background.jpg"); background-position: center; background-repeat: no-repeat; background-size: cover; background-attachment: fixed; min-height: 100%; } .banner { width: 100%; border-bottom: thick solid black; } ul { list-style-type: none; margin: 0; padding: 0; overflow: hidden; background-color: #333; border-bottom: thick solid black; } li { float: left; } li a { display: block; color: white; text-align: center; padding: 14px 16px; text-decoration: none!important; font-family: "Arial Black", Gadget, sans-serif; } li a:hover:not(.active) { background-color: #111; } .active { background-color: #FFD700; color: black; } .header { font-size: 80pt; font-family: "Arial Black", Gadget, sans-serif; color: black; text-align: center; min-width: 80pt; } .dotted_line { border-top: 2px dashed black; width: 70%; } .paragraph { font-size: 15pt; width: 500px; margin-left: 0%; color: black; } .sub_header { text-align: center; font-size: 50pt; color: black; } .credit { width: 560; size: 20pt; text-align: center; font-style: italic; } .video { width: 70%; margin-left: 15%; border: thick solid black; } .credit_link { text-decoration: none; } #image { width: 45%; } #text { width: 45%; float: left; font-size: 15pt; color: black; padding-top: 20px; -webkit-text-size-adjust: none; -ms-text-size-adjust: none; -moz-text-size-adjust: none; text-size-adjust: none; } .format { width: 90%; margin-left: 10%; } </style> </head> <body> </body> </html>函数之外创建一个promise。

承诺只能解决一次。每个请求都需要一个新的承诺。

此外getSomeData已经返回了一个承诺,但您无法将其作为数据直接推送到数组中。

您的代码应该更像:

服务:

$http

控制器

function myService($http, $q) {
  var service = {
    getSomeData: getSomeData
  };


  return service;

  function getSomeData(category) {

    if (category === 'books') {
      url = 'http://www.someurl1';
    } else {
      url = 'http://www.someurl2'
    };

    return $http.get(url, {
      params: {
        'type': category
      }
    }).then(function(response) {
      return response.data;
    }).catch(function(err) {
      console.log("Ooops", err)
    });
  }
}