Angular JS Fails After Upgrade from 1.1.0 to 1.1.1

StackOverflow https://stackoverflow.com/questions/15811062

Pregunta

When I upgrade the the ng-repeat takes extraordinarily long to load and tries to display MORE content boxes without the content that is being served by $resource.

I have narrowed the problem down to the update between 1.1.0 and 1.1.1. I looked through the changelog but nothing popped out at me to be the culprit, but it must be in there.

Changelog => https://github.com/angular/angular.js/blob/master/CHANGELOG.md#111-pathological-kerning-2012-11-26

The repository for this app => https://github.com/brianpetro/resume

Currently my angular looks like:

app = angular.module("Resume", ["ngResource"])

app.factory "Entry", ["$resource", ($resource) ->
  $resource("/entries")
]

@EntryCtrl = ["$scope", "Entry", ($scope, Entry) ->
  $scope.entries = Entry.query()
]

This happens on multiple views with using ng-repeat:

<html ng-app="Resume">
  <div ng-controller="EntryCtrl">
    <ul>
      <li ng-repeat="entry in entries">
        {{entry.title}}
      </li>
    </ul>
  </div>
</html>

This is AngularJS version 1.1.0: This is AngularJS version 1.1.0 This is AngularJS version 1.1.1: This is AngularJS version 1.1.1

¿Fue útil?

Solución

It's not entirely true that you have to add .json - at least not from my experience when I have switched from 1.0.x to 1.1.x.

In order to make Rails app return json without specyfing extension in URL for Angular 1.1.x you need to make angular add additional header to http request:

myModule.config(['$httpProvider', function ($httpProvider) {
    $httpProvider.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
}]);

Without that Rails by default renders whole HTML instead of returning JSON.

Github issue reflecting that

Otros consejos

The answer was in the URL file extension. Starting with Angular version 1.1.1, it is necessary to include '.json' in the resource.

 app = angular.module("Resume", ["ngResource"])

 app.factory "Entry", ["$resource", ($resource) ->
-  $resource("/entries")
+  $resource("/entries.json", {}, {}, {})
 ]

 app.factory "Done", ["$resource", ($resource) ->
-  $resource("/dones", {}, {update: {method: "PUT"}})
+  $resource("/dones.json", {}, {update: {method: "PUT"}}, {})
 ]

 app.factory "Resource", ["$resource", ($resource) ->
-  $resource("/resources", {}, {})
+  $resource("/resources.json", {}, {}, {})
 ]

Can someone clarify is this is because of my Rails 4 back-end or if it is a new Angular requirement?

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top