Search code examples
djangoapiangularjstastypie

Django does not renders AngularJS resource

I'm retrieving data django tastypie using AngularJS $resource service, but on the html page I'm not getting except li buttons equals to the returned objects, to be more specific I have just blank spaces and I cannot figure out why because verbatim tag is added.

Here is my code:

app file

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

subtitlesApp.controller('SubtitleController', 
function SubtitleController($scope, subtitleData) {
$scope.subtitles = subtitleData.query();
console.log($scope.subtitles);

subtitlesApp.factory('subtitleData', function ($resource) {

return $resource('/api/v1/entry/:id/?format=json', {id:'@id'}, {
    query: {method:'GET', isArray:false}
});
});

html file.

<div ng-controller="SubtitleController">
<li ng-repeat="subtitle in subtitles.objects"></li>
<h2> {% verbatim %} {{subtitle.id}} {% endverbatim %}</h2>

</div>

console

Resource
meta: Object
objects: Array[4]
0: Object
1: Object
2: Object
3: Object
length: 4
__proto__: Array[0]
__proto__: Resource

Thank you in advance. :)

Solution

  • The problem is with your angular template, not Django. subtitle is only in scope within the ng.repeat, which is party of the li element - but you close the li immediately after opening it. The h2 is not part of that scope.

    The Angular-batarang Chrome extension can help you debug issues with scopes like this.