Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript Building a MEAN Application Going MEAN with Angular GET-ing TODOs

Alex Artigas Perucha
Alex Artigas Perucha
6,146 Points

Not rendering todos

I've followed the exact steps. I even get the correct value for response.data.todos if I pause the debugger. Still there's no todo in the list.

Any clues?

Paul Ryan
Paul Ryan
4,584 Points

Can you post your code?

1 Answer

Alex Artigas Perucha
Alex Artigas Perucha
6,146 Points

I ended up solving that part by myself but then it broke again. This time after doing the webpack stuff.

The console throws an error: vendor.bundle.js:13539 Error: [$injector:unpr] Unknown provider: dataServiceProvider <- dataService <- mainCtrl http://errors.angularjs.org/1.5.3/$injector/unpr?p0=dataServiceProvider%20%3C-%20dataService%20%3C-%20mainCtrl

I went through the whole video again and couldn't find what I did wrong. Webpack worked fine and my code seems to be the same as the teacher's...

This is the todo.bundle.js:

webpackJsonp([0],[ /* 0 / /**/ function(module, exports, webpack_require) {

'use strict';

var angular = __webpack_require__(1);

angular.module('todoListApp', []);

__webpack_require__(3);

// }, / 1 /, / 2 /, / 3 */ /*/ function(module, exports, webpack_require) {

'use strict';

var angular = __webpack_require__(1);

angular.module('todoListApp')
.controller('mainCtrl', function($scope, dataService){

  dataService.getTodos(function(response){
    var todos = response.data.todos;  
    $scope.todos =  todos;
    });

  $scope.addTodo = function() {
    $scope.todos.unshift({name: "This is a new todo.",
                      completed: false});
  };

})

/***/ } ]);

I have officially resolved the same problem.

@Alex Artigas Perucha, you need to remove the s from todos.

var todos = response.data.todos;<--- 
  dataService.getTodos(function(response){
    var todos = response.data.todo;  
    $scope.todos =  todos;
    }); // This works