0

I am trying to render a json result from my angular controller in a view. But i am failing to do so. i need to show list of names present in the service. if i write like {{menu[0].name}} i get one result but i need to show a list of names

html

        <table>
         <tr ng-repeat="menu in MenuAnshu">
        <td>

        {{menu.name}}
    <  /td>
</tr>

below is my controller code:

         (function () {
var EmployeesController = function ($scope, employeeService, $log) {
    var employees = function (data) {
        $scope.Employees = data;

    };

    var MenuAnshuData = function (data) {
        $scope.MenuAnshu = data;
       console.log(data)
    };

    var errorDetails = function (serviceResp) {
        $scope.Error = "Something went wrong ??";
    };
    employeeService.employees().then(employees, errorDetails);
    employeeService.MenuAnshuData().then(MenuAnshuData, errorDetails);
    $scope.Title = "Employee Details Page";
    $scope.EmployeeName = null;
};

app.controller("EmployeesController", ["$scope", "employeeService", "$log", EmployeesController]);

}());

From service i am getting data like this

            (function () {
var employeeService = function ($http) {
    var employees = function () {
        return $http.get("http://localhost:63352/api/ptemployees")
                    .then(function (serviceResp) {
                        return serviceResp.data;
                    });
    };

    var MenuAnshuData = function () {
        return $http.get("http://redshaft.in/ocapi/index.php?route=api/order/getcategories").then(function (serviceResp) {
            return serviceResp.data;
        });


    };
    return {
        employees: employees,           
        MenuAnshuData: MenuAnshuData

    };
};

var module = angular.module("ProjectTrackingModule");
module.factory("employeeService", ['$http', employeeService]);

}());

i feel i am doing something wrong on js side. I am trying to access the array by menu.name but controller data is an object which has array.

JSON result which i have on controller side

               {"categories":[{"category_id":"20","image":"catalog\/demo\/compaq_presario.jpg","parent_id":"0","top":"1","column":"1","sort_order":"1","status":"1","date_added":"2009-01-05 21:49:43","date_modified":"2011-07-16 02:14:42","language_id":"1","name":"Desktops","description":"&lt;p&gt;\r\n\tExample of category description text&lt;\/p&gt;\r\n","meta_title":"","meta_description":"Example of category description","meta_keyword":"","store_id":"0"},{"category_id":"18","image":"catalog\/demo\/hp_2.jpg","parent_id":"0","top":"1","column":"0","sort_order":"2","status":"1","date_added":"2009-01-05 21:49:15","date_modified":"2011-05-30 12:13:55","language_id":"1","name":"Laptops &amp; Notebooks","description":"&lt;p&gt;\r\n\tShop Laptop feature only the best laptop deals on the market. By comparing laptop deals from the likes of PC World, Comet, Dixons, The Link and Carphone Warehouse, Shop Laptop has the most comprehensive selection of laptops on the internet. At Shop Laptop, we pride ourselves on offering customers the very best laptop deals. From refurbished laptops to netbooks, Shop Laptop ensures that every laptop - in every colour, style, size and technical spec - is featured on the site at the lowest possible price.&lt;\/p&gt;\r\n","meta_title":"","meta_description":"","meta_keyword":"","store_id":"0"},{"category_id":"25","image":"","parent_id":"0","top":"1","column":"1","sort_order":"3","status":"1","date_added":"2009-01-31 01:04:25","date_modified":"2011-05-30 12:14:55","language_id":"1","name":"Components","description":"","meta_title":"","meta_description":"","meta_keyword":"","store_id":"0"},{"category_id":"57","image":"","parent_id":"0","top":"1","column":"1","sort_order":"3","status":"1","date_added":"2011-04-26 08:53:16","date_modified":"2011-05-30 12:15:05","language_id":"1","name":"Tablets","description":"","meta_title":"","meta_description":"","meta_keyword":"","store_id":"0"},{"category_id":"17","image":"","parent_id":"0","top":"1","column":"1","sort_order":"4","status":"1","date_added":"2009-01-03 21:08:57","date_modified":"2011-05-30 12:15:11","language_id":"1","name":"Software","description":"","meta_title":"","meta_description":"","meta_keyword":"","store_id":"0"},{"category_id":"24","image":"","parent_id":"0","top":"1","column":"1","sort_order":"5","status":"1","date_added":"2009-01-20 02:36:26","date_modified":"2011-05-30 12:15:18","language_id":"1","name":"Phones &amp; PDAs","description":"","meta_title":"","meta_description":"","meta_keyword":"","store_id":"0"},{"category_id":"33","image":"","parent_id":"0","top":"1","column":"1","sort_order":"6","status":"1","date_added":"2009-02-03 14:17:55","date_modified":"2011-05-30 12:15:25","language_id":"1","name":"Cameras","description":"","meta_title":"","meta_description":"","meta_keyword":"","store_id":"0"},{"category_id":"34","image":"catalog\/demo\/ipod_touch_4.jpg","parent_id":"0","top":"1","column":"4","sort_order":"7","status":"1","date_added":"2009-02-03 14:18:11","date_modified":"2011-05-30 12:15:31","language_id":"1","name":"MP3 Players","description":"&lt;p&gt;\r\n\tShop Laptop feature only the best laptop deals on the market. By comparing laptop deals from the likes of PC World, Comet, Dixons, The Link and Carphone Warehouse, Shop Laptop has the most comprehensive selection of laptops on the internet. At Shop Laptop, we pride ourselves on offering customers the very best laptop deals. From refurbished laptops to netbooks, Shop Laptop ensures that every laptop - in every colour, style, size and technical spec - is featured on the site at the lowest possible price.&lt;\/p&gt;\r\n","meta_title":"","meta_description":"","meta_keyword":"","store_id":"0"}]}

My problem is i am not able to render list of names using {{menu.names}} on view. What i need to do to get the list of names on view?

Improve this question
3
  • Show us your controller code where you are populating variable MenuAnshu Commented Sep 3, 2016 at 9:56
  • Please add your controller code Commented Sep 3, 2016 at 9:57
  • Try to display the contents of MenuAnshu in your view like so: <pre>{{MenuAnshu | json}}</pre>. If this does not contain any data then this variable has not been populated with any data in your controller. Commented Sep 3, 2016 at 9:59

3 Answers 3

Reset to default
1

Your code is not easily readable.

I suggest you return the promise from your service to your controller and then resolve it like so:

// service
// return the promise of the GET request
var MenuAnshuData = function () {
    return $http.get("http://redshaft.in/ocapi/index.php?route=api/order/getcategories");
};

// controller
// make the call to MenuAnshuData from your service 
employeeService.MenuAnshuData().then(function(response) {

    // log the data so you can inspect what you have
    console.log(response.data)

    // pouplate MenuAnshu with the response
    $scope.MenuAnshu = data;

}, function(error) {

    // handle any failed response 

});
Improve this answer
Sign up to request clarification or add additional context in comments.

4 Comments

i have restructed the code. i tried ur code . in console i get op like this :Object {data: Object, status: 200, config: Object, statusText: "OK"} config : Object data : Object categories : Array[8] 0 : Object category_id : "20" how can i render this on the view.. by using the code i have written in html i cant achieve the desired result,
i get this response Object {categories: Array[8]} categories : Array[8] 0 : Object category_id : "20" column : "1" date_added : "2009-01-05 21:49:43" date_modified : "2011-07-16 02:14:42" description : "&lt;p&gt; ↵ Example of category description text&lt;/p&gt; ↵" image : "catalog/demo/compaq_presario.jpg" language_id : "1" meta_description : "Example of category description" meta_keyword : "" meta_title : "" name : "Desktops" in console...
my problem is how to render these list of names in view.. if i use a ng-repeat menu in menusnahsu and do {{menu.name}} or {{ menu.category.name}} i dont get the list of names in the view. if i do {{menu[0].name}} i do get one name though
If you want to repeat your categories then use ng-repeat="menu in MenuAnshu.categories"
0

If you want iterate over objects in angular js you have to do the following statement:

Ng-repeat="(key,value) in object"

Try that, I have seen that URL retrieve json object in first moment then I think can works.

comment the results !

Improve this answer

1 Comment

can u elaborate on that... not sure how to use (key, value) in my $scope object
0

I believe the issue is with this line: employeeService.MenuAnshuData().then(MenuAnshuData, errorDetails);

You can update your service as below:

var MenuAnshuData = function () {
    var config = {method: 'GET', url:"http://redshaft.in/ocapi/index.php?route=api/order/getcategories"}
    return $http(config);
};

And then access the promise's get method in your controller:

employeeService.MenuAnshuData().then(MenuAnshuData, errorDetails);
Improve this answer

6 Comments

tried this gives me this errorangular.js:12722 Error: [$http:badreq] errors.angularjs.org/1.4.9/$http/…
it gives me this json Object categories : Array[8] 0 : Object category_id : "20" column : "1" date_added : "2009-01-05 21:49:43" date_modified : "2011-07-16 02:14:42"
but i m not able to render list of names on ui . using the code i have written. My problem is rendering of names on the ui..
You're not able to render the names because there's issue with the data object. While your HTML seems perfectly fine, you could try using $parent.menuAnshu in HTML instead of menuAnshu. Also, please provide the JSON response so that it may help in debugging your problem.
i used $parent,menuanshu it is not working. i have updated the problem with json response
|

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.