Angularjs-Fehler: [filter:notarray] array Erwartet, aber bekam: {}, mit einem filter, der auf ein ng-repeat

Ich bin versucht zu füllen eine html-Tabelle mit einer eckigen Anfrage an eine API mit der ng-repeat-Direktive. Die html-Seite lädt dann zuerst der Antrag gestellt wurde, um die Daten zu erhalten, die füllt die Tabelle aus, wenn die Antwort zurückgegeben wird.
Wenn ich einen filter hinzufügen, um die ng-repeat-Direktive die Tabelle wird aufgefüllt und die filter-Funktionen, aber in meinem chrome-browser-Konsole bekomme ich folgende Fehlermeldung:

Fehler: [filter:notarray] array Erwartet, aber bekam: {}
http://errors.angularjs.org/1.4.3/filter/notarray?p0=%7B%7D
bei REGEX_STRING_REGEXP (eckige.js:68)
zu eckig.js:18251
am Objekt.fn (app.js:185)
bei Scope.$bekommen.Scope.$digest (eckige.js:15683)
bei Scope.$bekommen.Scope.$gelten (eckige.js:15951)
bei bootstrapApply (eckige.js:1633)
am Objekt.invoke (eckige.js:4450)
bei doBootstrap (eckige.js:1631)
bei bootstrap (eckige.js:1651)
bei angularInit (eckige.js:1545)

Habe ich eine Probe bis auf plunker, der Fehler wird auch angezeigt in der Konsole hier, wenn die Probe führen:

http://plnkr.co/edit/J83gVsk2qZ0nCgKIKynj?

Html:

<!DOCTYPE html>
<html>
<head>
  <script data-require="angular.js@*" data-semver="1.4.3" src="https://code.angularjs.org/1.4.3/angular.js"></script>
  <script data-require="angular-route@*" data-semver="1.4.3" src="https://code.angularjs.org/1.4.3/angular-route.js"></script>
  <script data-require="angular-resource@*" data-semver="1.4.3" src="https://code.angularjs.org/1.4.3/angular-resource.js"></script>
  <script type="text/javascript" src="example.js"></script>
  <link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.0/css/bootstrap-combined.min.css" rel="stylesheet" />
</head>
<body ng-app="inventoryManagerApp">
  <h3>Sample - Expected array error</h3> Filter
  <input type="text" id="quoteListFilter" class="form-control" ng-  model="search" />
  <div ng-controller="QuoteController">
    <table class="table table-bordered">
      <tbody>
        <tr>
          <th>Specification</th>
          <th>Quantity</th>
        </tr>
        <tr ng-repeat="quote in quotes | filter:search">
          <td>{{quote.SpecificationDetails}}</td>
          <td>{{quote.Quantity}}</td>
        </tr>
      </tbody>
    </table>
  </div>
</body>
</html>

Javascript:

var inventoryManagerApp = angular.module('inventoryManagerApp', [
  'ngResource',
  'quoteControllers'
]);

var quoteControllers = angular.module('quoteControllers', []);

quoteControllers.controller("QuoteController", ['$scope', 'filterFilter', 'quoteRepository',
  function($scope, filterFilter, quoteRepository) {

     $scope.quotes = quoteRepository.getQuoteList().$promise.then(
            function (result) {
                $scope.quotes = result;
            },
            function () {
            }
        );
  }
]);

inventoryManagerApp.factory('quoteRepository',
  function($resource) {
    return {
      getQuoteList: function() {
        return    $resource('http://drbsample.azurewebsites.net/api/Quotes').query();
      }
    };
  });

Scheint es zu sein, etwas zu tun, mit den Daten zu füllen, die ng-repeat-Direktive nicht sofort auf die Seite laden. Wenn ich ersetzen Sie das $ - Bereich.zitiert mit den json-Daten auf die Seite laden, anstatt anfordern von Daten von der API nicht den Fehler.

InformationsquelleAutor stonefree | 2015-08-25

Ist das problem mit dieser Aufgabe:

$scope.quotes = quoteRepository.getQuoteList().$promise.then(
        function (result) {
            $scope.quotes = result;
        },
        function () {
        }
    );

Funktion .then() gibt ein weiteres Versprechen Objekt zu erlauben die Verkettung: .then().then(), und weil es ein Objekt zurückgibt, das ist, warum Ihr erhalten notarray Fehler.

Zu vermeiden, Verweis-Fehler, den Sie angeben können $scope.quotes als leere arrray früher, dann weisen die Ergebnisse auf.

$scope.quotes = [];
quoteRepository.getQuoteList().$promise.then(
        function (result) {
            $scope.quotes = result;
        },
        function () {
        }
    );

InformationsquelleAutor Mateusz Kmiecik

7
```
$scope.quotes = quoteRepository.getQuoteList().$promise.then(
```
die Zuordnung unbrauchbar ist. löschen Sie einfach die $scope.quotes = von der Linie hat um Ihr problem zu lösen.

Versprechen.dann ist Sie ein Objekt zurückgeben, das ist völlig nutzlos für die repeat-Anweisung.

InformationsquelleAutor ibrahimbayer

Den $http-legacy-Versprechen Methoden .Erfolg und .Fehler wurden als veraltet markiert und entfernt werden, Gewinkelt v1.6.0. Verwenden Sie den standard .dann Methode statt.

Nun .dann Methode gibt Objekt mit mehreren Elementen: Daten, status, etc. So müssen Sie Antwort.Daten, anstatt nur eine Reaktion:

$http.get('https://example.org/...')
  .then(function (response) {

    console.log(response);

    var data = response.data;
    var status = response.status;
    var statusText = response.statusText;
    var headers = response.headers;
    var config = response.config;

    console.log(data);

});

InformationsquelleAutor Roman

quoteRepository.getQuoteList().then(
    function (result) {
        $scope.quotes = result;
    },
    function () {
    }
);

InformationsquelleAutor Rafael Francisco

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.