Question

我目前正在构建一些用于搜索输入的高级过滤器。我试图一次搜索多个JSON个对象。我已经能够使用函数.map和.reduce来创建这些过滤器。有关更多信息，请查看this question，它为我提供了此解决方案。因此，对于orders页面，我已经能够通过此功能添加客户名。看看下面的代码：

$http.get('config/get/getOrders.php', {cache: true}).then(function(response){
        $scope.orders = response.data.orders.order;
        $scope.orders.map( function addPlace(item) {
            item.firstname = $scope.customers.reduce(function(a,customers){
                return item.id_customer === customers.id ? customers.firstname : a;
            }, '');
            return item;
        });
    });

使用$scope.orders.map()和$scope.customers.reduce()我可以为orders数组添加值。通过这样做，我可以使用customer_name扩展我的搜索过滤器。

我现在遇到的问题实际上是两件不同的事情。首先，我要在获得一个项目之前尝试创建更高级的比较。（Combination_product_code）看看下面的代码：

$http.get('config/get/getProducts.php', {cache: true}).then(function(response){
    $scope.products = response.data.products.product;
    $scope.products.map( function addPlace(item) {
        item.eanCombination = $scope.productCombinations.reduce(function(a, productCombinations, stock_availables){
            return item.id === stock_availables.id + stock_availables.id === stock_availables.id_product_attribute + stock_availables.id_product_attribute === productCombinations.id ? productCombinations.ean13: a;
        }, '');
        return item;
    });
});

因为你可以看到我需要检查多个值，然后才能获得ean13遗憾的是，这不起作用，我想知道我是否能够这样做。 m设置比较对吗？我已多次检查所有值名称并且它们是正确的。

第二个问题是添加多个新项目。我一直在尝试添加product_name以及产品参考代码。看看下面的代码：

$http.get('config/get/getStock.php', {cache: true}).then(function (response) {
    $scope.stock_availables = response.data.stock_availables.stock_available;
    $scope.stock_availables.map( function addPlace(item) {
        item.product_name = $scope.products.reduce(function(a,products){
            return item.id_product === products.id ? products.name.language : a;
        },
        item.product_reference = $scope.products.reduce(function(b,products) {
            return item.id_product === products.id ? products.reference: b;
        }));
        return item;
    });
});

所以我的问题是在获取和添加项目并添加多个项目之前添加多个比较查询。

更新

我已经解决了关于＆＃34;添加多个项目的问题。＆＃34;我犯的错误是正确关闭了这个功能。一个工作的例子：

$http.get('config/get/getStock.php', {cache: true}).then(function (response) {
    $scope.stock_availables = response.data.stock_availables.stock_available;
    $scope.stock_availables.map( function addPlace(item) {
        item.product_name = $scope.products.reduce(function(a,products){
            return item.id_product === products.id ? products.name.language : a;
        }),
        item.product_reference = $scope.products.reduce(function(b,products) {
            return item.id_product === products.id ? products.reference: b;
        });
        return item;
    });
});

这意味着我正在寻找在获取数据之前使用多个比较查询的解决方案。

此数据的工作流程为：

我在产品数据中使用ng-repeat="product in products"我创建了与以下数据相对应的过滤器：

产品表： ID，名称，价钱，等

库存表： ID，的 PRODUCT_ID， 数量，的 product_attribute_id，

组合表： id - ＆gt; ＆＃34;与stock table＆＃34;中的attribute_id对应， combinationAN - ＆gt; ＆＃34;我试图达到＆＃34;，

的价值

所以工作流程是：

Stock table -> id_product from products table -> combination id -> attribute_id from stock table.

我可以使用以下功能在我的视图中对此进行过滤：

<h5 ng-if="combination.id >= 1 && product.id == stock_available.id_product && stock_available.id_product_attribute == combination.id" ng-repeat="combination in productCombinations" ng-bind="combination.ean13"></h5>

我想要做的是使用上面的示例将combination.ean13直接添加到products $scope。这样我就可以使用搜索输入来搜索该值，并仅显示这些产品。请参阅以下示例：

<input type="text" class="bc-f3f3f3 form-control no-border" ng-model="productSearch" ng-change="filterProduct(productSearch)" placeholder="{{ 'Zoek of scan producten' | translate }}">

<div ng-infinte-scroll="loadMore()" infinite-scroll-disabled='products.busy' infinite-scroll-distance='1' class="align-center tcolor-2a95cf text-center padding-t-25 padding-s-45 no-margin row">
    <div  class="productimg col-4" ng-repeat="product in products | orderBy: '-date_add' | filter: filterProduct(productSearch) | filter: {id_category_default: productCategory}">
        <div class="out-of-stock" ng-if="product.id == stock_available.id_product && stock_available.quantity == 0 && stock_available.id_product_attribute == 0" ng-repeat="stock_available in stock_availables">
            <div class="stock-circle"></div>
        </div>
        <div>
            <img ng-value="{{reference}}"  data-toggle="modal" data-target=".bd-example-modal-sm{{product.id}}"  ng-value="{{ean13}}" alt="{{product.name.language}}" ng-src="{{settings.url}}/{{product.id_default_image}}-home_default/{{product.link_rewrite.language}}.jpg" err-src="{{settings.url}}//img/p/nl-default-home_default.jpg" class="img-responsive product-img"/>
            <p ng-bind="product.name.language"></p>
            <p ng-bind="product.eanCombination"></p>
        </div>
    </div>
</div>

// Controller:
    $http.get('config/get/getProducts.php', {cache: true}).then(function(response){
        $scope.products = response.data.products.product;
        $scope.products.map( function addPlace(item) {
            item.eanCombination = $scope.productCombinations.reduce(function(a, productCombinations, stock_availables){
                return item.id === stock_availables.id_product + stock_availables.id_product === stock_availables.id_product_attribute + stock_availables.id_product_attribute === productCombinations.id ? productCombinations.ean13: a;
            }, '');
            return item;
        });
    });


    $scope.filterProduct = function(productSearch) {
        return (name.language = productSearch) || (ean13 = productSearch) || (reference = productSearch) || (eanCombination = productSearch);
    };

如果您有任何疑问，请在下面的评论中询问。

一如既往，提前谢谢！

对高级angularjs过滤器

0 个答案: