javascript - キャッチされていない TypeError: 未定義のプロパティ 'loadDataToGrid' を読み取ることができません

Question

サーバー側からjQGridに渡されるデータをロードするために使用するコードがあります。AngularJS ファクトリ メソッドを使用して呼び出しを開始し、受信した json ドキュメントを返します。Uncaught TypeError: Cannot read property 'loadDataToGrid' of undefinedChrome コンソールでエラーが発生します。

jQGrid にデータをロードするための JQuery 関数 :-

$(function ($scope,$http,$rootScope,retriveDataFromServer) {
$("#list").jqGrid({
    url: retriveDataFromServer.loadDataToGrid($http),
    datatype: "json",
    mtype: "GET",
    colNames: ["Employee First Name", "Employee Last Name", "Contact No"],
    colModel: [
        { name: "fname", width: 55 },
        { name: "lname", width: 60 },
        { name: "contactNo", width: 55, align: "right" },
    ],
    pager: "#pager",
    rowNum: 10,
    autowidth: true,
    rowList: [10, 20, 30],
    sortname: "fname",
    sortorder: "desc",
    viewrecords: true,
    gridview: true,
    autoencode: true,
    caption: "Employee Data Grid"
 });
});

AngulaJS ファクトリ メソッド :-

empApp.factory('retriveDataFromServer',function(){
return{
    loadDataToGrid: function($http){
        return $http({
            method : 'GET',
            url : 'http://localhost:8080/IdeaOne/viewall'
        }).then(function(response){
            return response;
        })
    }
 }
});

html :-

<div ng-app="empApp">
    <table id="list"><tr><td></td></tr></table>
    <div id="pager"></div>
</div>

jQueryメソッド内でURLを指定してデータを直接ロードすると、正常に機能します。

誰かが私がどこで間違ったのか指摘してください。