1个控制器AngularJS中的2个过滤器

时间:2014-05-30 10:22:55

标签: javascript angularjs filter angularjs-scope angular-ui-bootstrap

我只想询问是否可以在.controller中实现2个过滤器。 我正在使用2个过滤器,但只有1个过滤器工作(如果我删除其他过滤器,其他过滤器正在工作 - 反之亦然)。

我是否需要将过滤器转换为功能?有什么建议吗?

请检查代码

HTML

        <div class="form-group input-group" style="float: right;width: 20%; margin-top: -15px;">
        <select class="form-control please-select-action ng-pristine ng-valid ng-valid-required" style="list-style: none outside none; width:200px;  border-radius: 4px;" ng-model="filterOrderItem" ng-options="order.ordername for order in filterOrderOptions.orders">
        </select>
        </div>     

        <div class="form-group input-group" style="float: right;width: 20%; margin-top: -15px;">
        <select class="form-control please-select-action ng-pristine ng-valid ng-valid-required" style="list-style: none outside none; width:200px;  border-radius: 4px;" ng-model="filterPaymentMethodItem" ng-options="payment.paymentname for payment in filterPaymentMethodOptions.paymentmethod">
        </select>
        </div>

JS文件:

//启动订单状态的过滤器选项

$scope.filterOrderOptions = {

orders: [
{ordername : 'Order Status', orderStatus: 5 },
{ordername : 'canceled', orderStatus: "canceled" },
{ordername : 'closed', orderStatus: "closed" },
{ordername : 'delivered', orderStatus: "delivered" },
{ordername : 'for verification', orderStatus: "for_verification" },
{ordername : 'invoiced', orderStatus: "invoiced" },
{ordername : 'new', orderStatus: "new" },
{ordername : 'not delivered', orderStatus: "not_delivered" }, 
{ordername : 'on hold', orderStatus: "on_hold" },
{ordername : 'packed', orderStatus: "packed" },
{ordername : 'pending', orderStatus: "pending" },
{ordername : 'return received', orderStatus: "return_received" },
{ordername : 'shipped', orderStatus: "shipped" },
{ordername : 'verified', orderStatus: "verified" }
]
};

$scope.filterOrderItem = $scope.filterOrderOptions.orders[0];

$scope.customFilter = function (orderdata) {
if (orderdata.orderStatus === $scope.filterOrderItem.orderStatus) {
return true;
} 
else if ($scope.filterOrderItem.orderStatus === 5) {
return true;
} 
else {
return false;
}

}; 

//End filter options for Order Status


//Start filter options for Payment Method

$scope.filterPaymentMethodOptions = {

paymentmethod: [
{paymentname : 'Payment Method', paymentMethod: 6 },
{paymentname : 'Cash on Delivery', paymentMethod: "cashondelivery" },
{paymentname : 'Free', paymentMethod: "free" },
{paymentname : 'Paypal Express', paymentMethod: "paypal_express" }
]
};

$scope.filterPaymentMethodItem = $scope.filterPaymentMethodOptions.paymentmethod[0];

$scope.customFilter = function (paymentdata) {
if (paymentdata.paymentMethod === $scope.filterPaymentMethodItem.paymentMethod) {
return true;
} 
else if ($scope.filterPaymentMethodItem.paymentMethod === 6) {
return true;
} 
else {
return false;
}

};

//End filter options for Payment Method

0 个答案:

没有答案