Javascript function & setting $scope variable
<p>I have a function that gets called from my controller to my service.</p>

<pre><code>GridService.getHeaders($scope.grid);
</code></pre>

<p>Service is below...</p>

<pre><code>    function getHeaders(grid){
    var deferred = $q.defer();
    $http.put('v1/headers', grid).success(function (data) {
        deferred.resolve(data);
    }).error(function (data, status, headers, config) {
        deferred.reject(data);
    });
    return deferred.promise;
}
</code></pre>

<p>I need to get the data I receive from this and set it to a $scope variable in my controller...</p>

<pre><code>$scope.headers = (Data from getHeader function)
</code></pre>

<p>Which will then get injected into this function. Sorry if this all seems confusing... The way I had it originally was just setting </p>

<p>$scope.headers = GridService.getHeaders($scope.grid);</p>

<p>However $scope.headers always returns empty.</p>

<pre><code>    function getFullHeaders(headers, highlightFilteredHeader){
        var returnArray = [];

        for(var i = 0; i &lt; headers.length; i++ ){
            returnArray.push({
                field: headers[i].key, 
                displayName: headers[i].name,
                enablePaginationControls: true, 
                headerCellClass: highlightFilteredHeader,  
                enableFiltering: true,  
                enableSorting: true, 
                visible: true,  
                filter: { term: "", }
            });
        }

        return returnArray;
}
</code></pre>