Question

所以，这是我在SO中的第一个问题，我用Google搜索并搜索了SO但是没有得到我想解决的问题。我正在构建一个使用angularjs作为前端和JSON的电子商务网站来从我的后端服务器获取数据。

我已成功使用JSON列出所有产品并承诺。我把这个网站分开了：导航栏：使用categoryCtrl获取所有类别主要内容：使用storeCtrl处理购物车，订购，结账在主要内容的中间使用productCtrl来显示所有产品。

我是否需要在不同的Ctrl？
我希望根据我在导航页面中点击的内容使用productCtrl刷新其他div中的产品 NavigationPage：

<ul side-navigation class="nav metismenu" id="side-menu" ng-controller="categoryController">
<li data-ng-repeat="cat in categoryList" ui-sref-active="active">
     <a ng-if="cat.level == 1" ui-sref="store({ id:cat.category_id })">
        <span class="nav-label">{{cat.category_name}}</span> 
     </a>
</li>
</ul>

在我的config.js中是这样的：

$stateProvider
        .state('store/', {
            url: "/:id",
            templateUrl: "views/store.html",
            controller: storeController,
            resolve: {
                            qId: function ($stateParams) {
                                return $stateParams.id;
                            }
                        }
            
        })

在我的ProductController中是这样的：

angular
.module('myapps')
.controller('ProductCtrl', function($scope,productService,$modal, $stateParams){
    $scope.init = function(){
      var id = $stateParams.id;

      if(id == "")
        $scope.getAllProducts();
      else
        $scope.getAllProductsByCategory(id);
    }

    var id = $stateParams.id;

    $scope.getAllProducts = function(){
      productService.getAllProducts()
      .then(function(res){
        $scope.productList = productService.productList;
      }, function(err){
        //error result
        alert('failed');
      })
      
    }

    $scope.getAllProductsByCategory = function(id){
      productService.getProductByCategory(id)
      .then(function(res){
        $scope.productList = productService.productList;
      }, function(err){
        //error result
        alert('failed');
      })
    }


    $scope.init();
});

但仍然没有刷新产品清单。

更新主要内容中另一个div的产品列表：

<div class="row" ng-controller="ProductController">
    <div class="product-list">
        <div class="product-box" data-ng-repeat="product in productList.product">
            
<div class="product-name">       
  {{product.product_name}}
</div>
<div class="product-price">
{{product.price | number}} ,-
</div>
 
            </div>
      </div>
</div>

我希望在另一个div中使用searchbox来过滤产品，它会调用productCtrl中的函数来根据关键字从JSON获取数据，但我仍然不知道如何在输入搜索框后立即刷新内容有一些价值

非常感谢你的帮助。

angularjs过滤产品基于类别和搜索栏

0 个答案: