AngularJS $http.get to call a MVC5 action

Question

I am newbie in AngularJS. I've created an application with AngularJS. I have an app folder that inside it I have a list folder with for file : List.html and

listcontroller.js

angSalaryApp.controller('listController',
function ListController($scope, ListService) {
    $scope.list = listService.newlist;

    $scope.count = 0;

    $scope.submitForm() = function () {

    };

    $scope.updateName() = function () {
        $scope.count++;
    };
});

listService.js

angSalaryApp.factory('ListService',
    ["$http",
        function ($http) {
            var newList = function(){
                return $http.get("Areas/Employer/List/newlist");
            };
        }
    ]);

listdirective.js

    angSalaryApp.directive("listForm", function () {
    return {
        restrict: "E",
        templateUrl: "app/list/list.html"
    }
});

In app folder I have a JS file as SalaryApp.js

var angSalaryApp = angular.module('angSalaryApp',[])

When my code invoked $http.get I got an error message

Error: [$injector:undef] Provider 'ListService' must return a value from $get factory method.
http://errors.angularjs.org/1.4.6/$injector/undef?p0=ListService
   at enforcedReturnValue (http://localhost:5137/Scripts/angular.js:4330:9)
   at invoke (http://localhost:5137/Scripts/angular.js:4476:7)
   at Anonymous function (http://localhost:5137/Scripts/angular.js:4293:13)
   at getService (http://localhost:5137/Scripts/angular.js:4435:11)
   at invoke (http://localhost:5137/Scripts/angular.js:4464:9)
   at Anonymous function (http://localhost:5137/Scripts/angular.js:9127:11)
   at nodeLinkFn (http://localhost:5137/Scripts/angular.js:8239:13)
   at compositeLinkFn (http://localhost:5137/Scripts/angular.js:7671:13)
   at compositeLinkFn (http://localhost:5137/Scripts/angular.js:7675:13)
   at publicLinkFn (http://localhost:5137/Scripts/angular.js:7546:30)

Answer 1

In controller you are injecting ListService so call ListService.newlist instead of listService.newlist

angSalaryApp.controller('listController',
function ListController($scope, ListService) {
    $scope.list = ListService.newlist;
});

In factory, it should return object but you are not returning any object so return object by adding function in return object.

angSalaryApp.factory('ListService', ["$http",
  function($http) {
    return {
      newList: newList
    };

    function newList() {
      return $http.get("Areas/Employer/List/newlist");
    }
  }
]);