AngularJS mit ng-scroll-und ng-repeat

Verwendung von angular-ui mit den eckigen. Markup enthält eine ng-scroll element, das ich an der Arbeit mit abgerufenen Daten aus einem Dienst. Ich möchte Zeilen von Elementen, so dass eine ng-repeat innerhalb einer ng-scroll. Dies funktioniert im Prinzip (plunker) aber AngularJS sagt, ich habe etwas falsch in der JSON-Kodierung und brauchen Hilfe, um herauszufinden, was ich falsch mache.

So klar zu sein, das markup und JSON unten arbeiten in plunker aber nicht in der app. Das JSON in der plunker und unten ist entnommen aus dem debugger Antwort Körper.

Markup:

<div class="row" >
  <div class="col-md-12" >
    <div class="video_thumb" ng-scroll='video_list in VideoIndexScrollerSource' buffer-size='10' padding="2" >
      <div class="row" ng-repeat="video in video_list">
        <p>
          <a ng-href="/guides/{{video._id}}" target="_self">
            <img ng-src="{{video.thumb}}">
          </a>
        </p>
      </div>
    </div>
  </div>
</div>

JSON:

In Rails erstelle ich ein array von arrays. Jedes element ist ein hash, der die Eigenschaften zur Verwendung in den oben genannten Anzeige-code. Die JSON zurückgegeben, die wie folgt aussieht:

[
  [
    {
      "thumb": "/uploads/thumb_11167113_det.jpg",
      "_id": "52264092a0eef2d029673f72"
    },
    {
      "thumb": "/uploads/thumb_11169448_det.jpg",
      "_id": "522649b7a0eea05c61388f4a"
    },
    {
      "thumb": "/uploads/thumb_278817_det.jpg",
      "_id": "522649b4a0eea05c61388be2"
    },
    {
      "thumb": "/uploads/thumb__old_",
      "_id": "522e5290e4b0889f651f13ae"
    },
    {
      "thumb": "/uploads/thumb_269411_det.jpg",
      "_id": "522649baa0eea05c613891b3"
    },
    {
      "thumb": "/uploads/thumb__old_",
      "_id": "5227d1f3a0ee91bdc636efb9"
    },
    {
      "thumb": "/uploads/thumb_11169964_det.jpg",
      "_id": "52264091a0eef2d029673e49"
    }
  ],
  [
    ...
  ],
  [
    ...
  ]
]

Nicht sicher, warum dies nicht funktioniert, die ng-Blättern sollte die Iteration Zeilen setzen ein array in video_list, ng-repeat sollte schnappen Sie sich jedes Objekt aus der Reihe und erhalten Werte.

Fehler:

Dies ist der AngularJS-Fehler bekomme ich, wenn die oben genannten JSON zurückgegeben:

TypeError: Object #<Resource> has no method 'push'
    at copy (http://localhost:3000/assets/angular-1.2.0/angular.js?body=1:827:33)
    at new Resource (http://localhost:3000/assets/angular-1.2.0/angular-resource.js?body=1:402:21)
    at http://localhost:3000/assets/angular-1.2.0/angular-resource.js?body=1:483:52
    at Array.forEach (native)
    at forEach (http://localhost:3000/assets/angular-1.2.0/angular.js?body=1:301:21)
    at angular.module.factory.Resource.(anonymous function).$http.then.value.$resolved (http://localhost:3000/assets/angular-1.2.0/angular-resource.js?body=1:482:37)
    at deferred.promise.then.wrappedCallback (http://localhost:3000/assets/angular-1.2.0/angular.js?body=1:10598:99)
    at deferred.promise.then.wrappedCallback (http://localhost:3000/assets/angular-1.2.0/angular.js?body=1:10598:99)
    at http://localhost:3000/assets/angular-1.2.0/angular.js?body=1:10684:40
    at Scope.$get.Scope.$eval (http://localhost:3000/assets/angular-1.2.0/angular.js?body=1:11577:44) angular.js?body=1:9102
(anonymous function) angular.js?body=1:9102
$get angular.js?body=1:6707
deferred.promise.then.wrappedCallback angular.js?body=1:10601
deferred.promise.then.wrappedCallback angular.js?body=1:10598
(anonymous function) angular.js?body=1:10684
$get.Scope.$eval angular.js?body=1:11577
$get.Scope.$digest angular.js?body=1:11422
$get.Scope.$apply angular.js?body=1:11683
done angular.js?body=1:7700
completeRequest angular.js?body=1:7866
xhr.onreadystatechange angular.js?body=1:7822
  • Ich vermute, dass es gibt einige Analyse-code in eckige, einige übereinkommen, dass ich in Konflikt geraten, da die raw-Daten funktioniert in der plunk-aber es ist bereits analysiert. Die app setzt auf Eckige, die zum analysieren der Antwort.
  • Ich bin mit der Ressource "Abfrage" - Methode, wo isArray true ist--eine ähnliche Frage hat, diese als Lösung.
  • Können Sie Ihre $Ressource nennen? (da sehen wir an der stack-trace, das Problem innerhalb: $get
  • Kein Problem mit bekommen, es wurde wieder ein array von arrays, die AngularJS offenbar nicht zulassen. Ich hatte zu wickeln jede innere array mit einem Objekt, und alles funktionierte. Leicht unterschiedliche Art und Weise, um die Daten unten zeigen.
InformationsquelleAutor pferrel | 2013-12-07
Schreibe einen Kommentar