CODEWITHSUNDEEP
restangularjs
Benj
Benj

Reputation: 329

Rest, ngresource, $resource not returning anything

I'm trying to GET Rest data from a parse.com backend with Angularjs. I expect at least console log you can see in the code below to return something, but it returns nothing, and there are no error in the console.

Here is the code i'm trying: Full Javascript code:

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


todoApp.factory('todoFactory', function($resource) {
    return $resource('https://api.parse.com/1/classes/Professional', {}, {
        method: 'GET',
        headers: { 'X-Parse-Application-Id':'xxx', 'X-Parse-REST-API-Key':'yyy'}
    });
});

function TodoController($scope, $location, todoFactory) {
    function loadTodos() {
        $scope.items = todoFactory.query();
        console.log(todoFactory.query());  //i expect this to log something at least
    }

}

Full html code:

<!DOCTYPE html>
<html ng-app="todoApp">
<head>
    <title></title>
</head>
<body>

<div ng-controller="TodoController">
    <ul>
        <li ng-repeat="item in items"> {{item.firstName}} </li>
    </ul>
</div>

<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.0/angular.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.0/angular-resource.min.js"></script>

Any clue on how to give life to this dead code ?

Upvotes: 0

Views: 808

Answers (1)

D.Evangelista
D.Evangelista

Reputation: 6543

The problem is that you are not calling your function.

You have two options:

In your controller:

function TodoController($scope, $location, todoFactory) {
    function loadTodos() {
        $scope.items = todoFactory.query();
        console.log(todoFactory.query()); 
    }
    // You declare the function, now you can use this
    loadTodos();
}

But, in this way, the function isn't available in your view, because it isn't declared in the $scope. To that, you should declare like this:

function TodoController($scope, $location, todoFactory) {
    $scope.loadTodos = function() {
        $scope.items = todoFactory.query();
        console.log(todoFactory.query()); 
    }
}

You declare the function in $scope, now you can use in the view like this:

<button type="button" ng-click="loadTodos()">Get Items</button>

Upvotes: 1

Related Questions