来自Poller的数据不显示在ng-repeat内

时间:2022-03-24 12:51:23

Simple issue i believe but i cant seem to figure it out since i am still new. I have a poller setup to query my file and it should display inside my partial but it does not here is the code:

简单的问题,我相信,但我似乎无法弄清楚,因为我还是新的。我有一个轮询器设置来查询我的文件,它应该显示在我的部分内,但它不是这里的代码:

Also this setup should update the Partial with New Data every 1 second correct? so when i add a new data to the file.

此设置还应每1秒更新一次部分新数据吗?所以当我向文件添加新数据时。

app.factory('Poller', function($http, $timeout) {

var data = { response: {}, calls: 0 };

var poller = function () {
  $http.get('http://localhost/app/controllers/php/getProjects.php')
  .then(function(r) {
    data.response = r.data;
    data.calls++;
    $timeout(poller, 1000);
  });
};
poller();

return {
  data: data.response
};

});

app.controller('openProjectsCtrl', ['$scope', '$http', 'projectsModal', 'Poller',
function ($scope, $http, projectsModal, Poller) {

  $scope.data = Poller.data;

}]);

<li class="list-item" data-ng-repeat="project in data | orderBy:'Posted' : true">
    <div data-ng-click="showModal(project.uid)">
        <h4>{{project.Title}}</h4>
        <span>{{project.Skills}}</span><br/>
        <div>
            <span>{{project.Budget}}</span>
            <span class="pull-right timestamp">{{project.Posted|timeago}}</span>
        </div>
    </div>
</li>

Sample Json file:

示例Json文件:

{ 
"item": [
{
    "uid"   : "1",
    "Title" : "Thing",
    "Offers": "0",
    "Skills": "1,2,3",
    "Posted": "June 17, 2015 13:30:00",
    "Budget": "$250"
}
]
}

3 个解决方案

#1


1  

plunker http://plnkr.co/edit/VMXN58uIrmfYRUgydtbr

(function () {
  'use strict';

angular.module('app', []);

angular.module('app')
  .controller('openProjectsCtrl', openProjectsCtrl);

openProjectsCtrl.$inject = ['$scope', 'Poller'];

function openProjectsCtrl($scope, Poller) {
  $scope.data = Poller.data;
}

angular.module('app')
    .factory('Poller', Poller);

Poller.$inject = ['$http', '$timeout'];

function Poller($http, $timeout) {

var data = { response: [], calls: 0 };

var json = [{
  "id": 1,
  "Skills": "Marketing Assistant",
  "Budget": "$5.66",
  "Posted": "7/14/2014"
}, {
  "id": 2,
  "Skills": "Paralegal",
  "Budget": "$6.43",
  "Posted": "9/7/2014"
}, {
  "id": 3,
  "Skills": "Statistician II",
  "Budget": "$5.06",
  "Posted": "2/10/2015"
}, {
  "id": 4,
  "Skills": "Payment Adjustment Coordinator",
  "Budget": "$3.42",
  "Posted": "1/19/2015"
}];


var poller = function () {
  // $http.get('http://localhost/app/controllers/php/getProjects.php')
  // .then(function(r) {
    // data.response = r.data;
    // data.calls++;
    // $timeout(poller, 1000);
  // });
  angular.copy(json, data.response);
};

poller();

return {
  data: data.response
};
}
})();

#2


0  

Where you do navigate to the 'item' object?

你在哪里导航到'item'对象?

Try:

return {
  data: data.response.item;
};

#3


0  

Write your service like this

写这样的服务

app.factory('Poller', function($http) {

return {
      poll: function () {
              return $http.get('http://localhost/app/controllers /php/getProjects.php');
           }  
       }
});

Use it in your controller like this

像这样在你的控制器中使用它

app.controller('openProjectsCtrl', ['$scope', '$http', 'projectsModal',   'Poller','$interval'
function ($scope, $http, projectsModal, Poller,$interval) {

 $interval(function(){
     Poller.poll().success(function(response){
        $scope.data=response.data;
     }).error(function(error){
        //handle error here
     })},1000);
}]);

#1


1  

plunker http://plnkr.co/edit/VMXN58uIrmfYRUgydtbr

(function () {
  'use strict';

angular.module('app', []);

angular.module('app')
  .controller('openProjectsCtrl', openProjectsCtrl);

openProjectsCtrl.$inject = ['$scope', 'Poller'];

function openProjectsCtrl($scope, Poller) {
  $scope.data = Poller.data;
}

angular.module('app')
    .factory('Poller', Poller);

Poller.$inject = ['$http', '$timeout'];

function Poller($http, $timeout) {

var data = { response: [], calls: 0 };

var json = [{
  "id": 1,
  "Skills": "Marketing Assistant",
  "Budget": "$5.66",
  "Posted": "7/14/2014"
}, {
  "id": 2,
  "Skills": "Paralegal",
  "Budget": "$6.43",
  "Posted": "9/7/2014"
}, {
  "id": 3,
  "Skills": "Statistician II",
  "Budget": "$5.06",
  "Posted": "2/10/2015"
}, {
  "id": 4,
  "Skills": "Payment Adjustment Coordinator",
  "Budget": "$3.42",
  "Posted": "1/19/2015"
}];


var poller = function () {
  // $http.get('http://localhost/app/controllers/php/getProjects.php')
  // .then(function(r) {
    // data.response = r.data;
    // data.calls++;
    // $timeout(poller, 1000);
  // });
  angular.copy(json, data.response);
};

poller();

return {
  data: data.response
};
}
})();

#2


0  

Where you do navigate to the 'item' object?

你在哪里导航到'item'对象?

Try:

return {
  data: data.response.item;
};

#3


0  

Write your service like this

写这样的服务

app.factory('Poller', function($http) {

return {
      poll: function () {
              return $http.get('http://localhost/app/controllers /php/getProjects.php');
           }  
       }
});

Use it in your controller like this

像这样在你的控制器中使用它

app.controller('openProjectsCtrl', ['$scope', '$http', 'projectsModal',   'Poller','$interval'
function ($scope, $http, projectsModal, Poller,$interval) {

 $interval(function(){
     Poller.poll().success(function(response){
        $scope.data=response.data;
     }).error(function(error){
        //handle error here
     })},1000);
}]);