Getting Json data in the Angularjs Scope

Question

This is my first attempt at using Angularjs framework. I am trying to follow this example: http://jsfiddle.net/SAWsA/11/

I am successfully able to get the data in the Json format and it works fine. json data:

[{"Activity_Matrix_ID":"163","Activity_ID":"131","Activity_Date":"2062-02-16","Activity_Category":"Maintanence","Activity_Project":"All Projects","Activity_Description":"Json data ","Activity_Hours":"2"},{"Activity_Matrix_ID":"161","Activity_ID":"129","Activity_Date":"2044-02-25","Activity_Category":"Tech Support","Activity_Project":"All Projects","Activity_Description":"Dummy dummy ","Activity_Hours":""}]

So basically, I want to load the data in $scope.items. I am not sure if it is the good method. I can visit the url and the data looks fine. I am stuck at getting the json correctly from the URL to the angular scope.

I tried following

    <script type="text/javascript">
        var sortingOrder = 'Activity_Projects';
    </script>

<script>
function ctrlRead($scope, $filter) {

         $scope.myData = function(item, event) {

          var responsePromise = $http.get({method: 'GET', url: 'https://url_root_same_domain/timesheet/timesheet_info_table_json.php'}).success(function(data, status, headers, config) {

              $scope.items = data; 
              console.log(data);
            }).
            error(function(data, status, headers, config) {
              alert("No data");
            });
        }
 </script>

Use Angular's $http.get() to load data. You've provided a lot of code, so it is difficult to sort through. Can you put together a simple sample demonstrating your problem? — JeffryHouser
– JeffryHouser, Commented Feb 19, 2014 at 22:12
Hi Jeffry, I am having trouble with $http.get() method. Now the code is edited to show the problematic area. Thanks for the reply. — deepseas
– deepseas, Commented Feb 19, 2014 at 22:17

JeffryHouser · Accepted Answer · 2014-02-19 22:26:12Z

2

Try this:

var responsePromise = $http.get('https://url_root_same_domain/timesheet/timesheet_info_table_json.php').success(...rest of your code here

The $http.get() function's first argument is a URL; not an object; and the method of a get call is already get, so you shouldn't have to do any other changes.

answered Feb 19, 2014 at 22:26

JeffryHouser

39.4k4 gold badges41 silver badges60 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

deepseas Over a year ago

I am getting this error in the console: "TypeError: Cannot read property 'length' of undefined". I guess the json is still not able to load and it is trying to parse "undefined".

deepseas Over a year ago

function PostsCtrlAjax($scope, $http) { $http({method: 'GET', url: 'root_url/timesheet/timesheet_info_table_json.php'}).success(function(data) { $scope.items = data; // response data console.log(data); }); } Do you think this syntax is correct? I am pretty sure that I am able to access the json url. I tried putting the php code which retrieves the json data directly into $scope.data and it works fine.

JeffryHouser Over a year ago

The syntax looks right to me; however I usually use the helper functions, and don't know the 'native' syntax off the top of my head

deepseas Over a year ago

I was finally able to get the Json data in the console using the URL but it still does not display all the data in the table. I had to inject $http in ctrlRead.$inject = ['$scope', '$filter','$http']; and I had to use JSON.stringify on the returned data.Thanks for the comments and response. I really appreciate it.

JeffryHouser Over a year ago

I should have noticed you weren't injecting $http into the controller. My bad!

|

Collectives™ on Stack Overflow

Getting Json data in the Angularjs Scope

1 Answer 1

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related