CODEWITHSUNDEEP
angularjs
user2400440
user2400440

Reputation: 21

How to display products category wise in angularjs

I m new to angularjs and m trying to return an object from a function to ng-repeat. 

<div ng-controller="homeCtrl">
<div ng-init="getProductCategories()">
    <div ng-repeat="productCategory in productCategories">
        <span>{{productCategory._id}}</span>
        <span>{{productCategory.name}}</span>
        <div ng-click="getProducts(productCategory._id)">category</div>
        <div ng-repeat="product in products">
            {{product.title}}
        </div>

    </div>
</div>

and controller function is :: 

 .controller('homeCtrl', function($scope,$appService) {

    $scope.getProductCategories = function(){
    var query={"table":"product_categories"};
    query.columns=["name","description"];
    var queryParams ={query:JSON.stringify(query), "ask":ASK, "osk":OSK};
    var serviceUrl = "/rest/data";
    $appService.getDataFromJQuery(serviceUrl, queryParams, "GET", "JSON",function(productCategoryData){
        $scope.productCategories = productCategoryData.data;
    }, function (jqxhr, error) {
    })
    return $scope.productCategories;
}

   $scope.getProducts = function(categoryid) {

    var query={"table":"products"};

    query.columns=["cost","description","image","name","short_description",{"expression":"product_category","columns":["_id","name"]}];
    query.filter = {"product_category":categoryid};

    var queryParams ={query:JSON.stringify(query), "ask":ASK, "osk":OSK};
    var serviceUrl = "/rest/data";
    $appService.getDataFromJQuery(serviceUrl, queryParams, "GET", "JSON",function(productData){
        $scope.products = productData.data;

    }, function (jqxhr, error) {
    })
    return $scope.products;

}
  });

it does not show data as i wanted and crashes my browser on every page load.

it shows

category 1 Product a Product b

category 2 Product a Product b

instead of category 1 Product a Product b

category 2 Product c Product d

Upvotes: 0

Views: 2086

Answers (1)

Sudarshan Kalebere
Sudarshan Kalebere

Reputation: 3937

You are using two ng-repeat so try using ng-repeat-start and ng-repeat-end for example-

<div ng-repeat-start="thing in app.things">{{ thing }}</div>
  <div ng-repeat-end=""></div>

You can refer here for more information

[http://www.thinkster.io/angularjs/mR4rB2Xu4N/angularjs-ng-repeat-start][1]

Upvotes: 1

Related Questions