Question

Index page

右侧Bajra atta，贝桑，玉米粉......是子类别。

的index.html

<body>
    <div class='container'>
        <div class='row'>
            <div class='col-md-4'></div>


            <!-- Serach Area -->
            <div class='col-md-5'>
                <input style="margin-top:5px;" type="text" ng-model="SearchText" placeholder="Search for more than 10,000 products..." class='form-control' size="50">
            </div>  

            <div class='col-md-1'></div>

            <div class='col-md-2'>
                <a id="top_login" href="#Login" style="position:absolute; margin-top:15px; color:#FFFCBA"> 
                    <strong>LOGIN </strong>
                </a>
            </div>
        </div>
    </div>

    <div  ng-controller="MainCtrl">

        <div class='container'>
            <div class='row'>
                <div class='col-md-2 Name'>
                    <!-- Super Categories-->
                </div>


                <div class='col-md-7'> </div>

                <div class='col-md-2'>
                    <!--SC Cart-->
                </div>

                <div class='col-md-1'></div>
            </div>
        </div>




        <div id="middle" class='container'>
            <div class='row'>
                <div id="left" class="col-md-2">
                    <!-- categoris and sub categories -->
                </div>


                <div id="right" class="col-md-6">
                    <div ng-view></div>
                </div>
            </div>
        </div>


    </div>

    <div id="footer">
        <!-- Footer --> 
    </div>

</body>

products.html放在

<div class='box' ng-repeat="product in ProductService.Products  | filter:SearchText | filter:FilterExpr:true| orderBy:'ProductName'">
    <!-- Display filtered Products -->
</div>

的ProductsController

sampleApp.controller('ProductsController', function ($scope, $routeParams, $log, $rootScope, ProductService) {

    $scope.SCId = $routeParams.SCId;

    $scope.ChangeFilter = function() {
        if ($routeParams.SCId)  {
            $scope.FilterExpr = {'SubCategoryID': $routeParams.SCId.toString()};
        }
    };

    $scope.ChangeFilter();

});

配置代码

sampleApp.config(['$routeProvider',
  function($routeProvider) {
    $routeProvider.
        when('/Login', {
            templateUrl: 'templates/ShowLogin.html',
            controller: 'LoginController'
        }).
        when('/ShoppingCart', {
            templateUrl: 'templates/ShoppingCart.html',
            controller: 'ShoppingCartController'
        }).

        when('/Products/:SCId', {
            templateUrl: 'templates/Products.html',
            controller: 'ProductsController'
        }).
        otherwise({
            redirectTo: '/Products/38'
        });
}]);

当用户点击子类别时，会列出该子类别的产品。否则是redirectTo：子类别38的'/ Products / 38'产品最初列出。

我面临以下问题：

当用户开始在搜索框中输入时，过滤器：SerachText应用于显示的子类别产品。 但此时我想过滤：SerachText适用于所有产品（不仅适用于选定的子类别产品）
过滤器未应用，如果我们在其他路由页面中说登录页面。 我想在用户开始输入搜索框product.html和productsController后立即激活。
当用户在搜索框中输入内容并点击子类别时，并非该子类别的所有产品都列出，因为此处应用了过滤器：SerachText。 在这种情况下，我不想应用过滤器：SerachText过滤器

可以请一些人帮我解决所有这些问题。我已经尝试了所有组合和排列，但没有运气。如果需要改变架构可以使事情变得更好，我也很好。

Answer 1

您是否曾尝试将SearchText过滤范围提升至$parent.SearchText ??

我想，您的过滤器中的优势范围（$parent或$rootScope）可以正常工作。

顺便说一句它对我有用，因为看起来ng-include为每个HTML呈现本地范围，即使在同一页面中也是如此。

P.D：对不起我的英语，来自委内瑞拉的问候：D

AngularJS Filter未按预期工作

1 个答案: