CODEWITHSUNDEEP
angularjsonsen-ui
Miao
Miao

Reputation: 159

I want to use ons-lazy-repeat but there is a error

My code as follows：

var module = ons.bootstrap('my-app', ['onsen','ngSanitize'],['infinite-scroll']);

module.controller('NewsController', ['$scope', '$http', '$q','$timeout', function($scope, $timeout, $http, Demo, $q) {

 $scope.MyDelegate = {
  configureItemScope: function(index, itemScope) {
    if (!itemScope.item) {
      itemScope.canceler = $q.defer();

      itemScope.item = {
        title: 'Item #' + (index + 1),
        label: '',
        desc: '',
        rand: Math.random()
      };
      $http.get('https://baconipsum.com/api/?type=meat-and-filler&sentences=1', {
        timeout: itemScope.canceler.promise
      }).success(function(data) {
        itemScope.item.desc = data[0];
        itemScope.item.label = itemScope.item.desc.substr(0, itemScope.item.desc.indexOf(" ")) + 'bacon'
      }).error(function() {
        itemScope.item.desc = 'No bacon lorem ipsum';
        itemScope.item.label = 'No bacon'
      });
    }
  },
  calculateItemHeight: function(index) {
    return 91;
  },
  countItems: function() {
    return 10000000;
  },
  destroyItemScope: function(index, itemScope) {
    itemScope.canceler.resolve();
  }
};
)]};

In fact, I just copied the document of ons-lazy-repeat from http://onsen.io/blog/onsenui-1-2-2-new-components-lazy-repeat/

the error is : Error: undefined is not an object (evaluating '$q.defer')

Anybody knows the reason for this issue?

Upvotes: 1

Views: 453

Answers (1)

Claies
Claies

Reputation: 22323

You have incorrectly injected your dependencies into your controller. The order of the string names of the dependencies must match exactly the order of the function imports. What you have:

module.controller('NewsController', ['$scope', '$http', '$q', '$timeout',
                             function($scope, $timeout, $http, Demo, $q) {

What you should have:

module.controller('NewsController', ['$scope', '$http', '$q', '$timeout',
                             function($scope, $http, $q, $timeout) {

Also, you have Demo as a function import, but don't have 'Demo' listed in the imports; you don't appear to be using it, but if you are using it, you should ensure you have both, in the matching order.

Also, I'm not sure why you have multiple arrays being injected into your app module:

var module = ons.bootstrap('my-app', ['onsen','ngSanitize'],['infinite-scroll']);

This may or may not work correctly, but it's definitely not the standard syntax. It should be:

var module = ons.bootstrap('my-app', ['onsen','ngSanitize','infinite-scroll']);

Upvotes: 2

Related Questions