angular如何重新加载控制器

angular how to reload a controller

本文关键字:控制器 加载 何重新 angular      更新时间:2023-09-26

我有一个类别面板控制器,单击它时,我想在我的ng控制器产品面板中显示该类别的所有产品。我遇到的问题是,每次我点击ng-click="selectorCategory",刷新页面后,我都会得到点击类别中的所有产品。

     <div class="col-md-6 m-t-10" ng-controller="productsPanel" style="padding-right:1px;">
        <div class="panel panel-default" style="height: 700px">
            <div class="panel-body">
                <div ng-repeat="product in Products" class="productRow">
                    <a href="javascript:;" class="btn btn-white btn-xlarge btn-block">{{product.Product}}</a>
                </div>
            </div>
        </div>
    </div>
    <div class="col-md-3 m-t-10" ng-controller="categoriesPanel" style="padding-left: 0; padding-right: 5px">
        <div class="panel panel-default" style="height: 700px">
            <div class="panel-body">
                <div ng-repeat="category in Categories" class="categoryRow">
                    <a href="javascript:;" data-id="{{category.CategoryId}}" ng-click="selectedCategory($event)" class="btn btn-white btn-xlarge btn-block">{{category.Category}}</a>
                </div>
            </div>
        </div>
    </div>

这是我的angular脚本,它从后端获取正确的数据,但当我刷新页面时,数据只显示在productsPanel控制器中。我想在你点击后立即显示数据。

app.controller('categoriesPanel', function($scope, $location, $http, $localStorage){
var CompanyId = $localStorage.Employee[0].CompanyId;
$http({
    method  : 'GET',
    url     : 'http://localhost:8888/categories/ajax_getCompaniesCategories',
    params: {CompanyId: CompanyId}
})
.success(function(data){
    $scope.Categories = data;
    $localStorage.Categories =  data;
});
$scope.selectedCategory = function(event){
    $localStorage.CategoryId = $(event.target).data('id');
    $http({
        method  : 'GET',
        url     : 'http://localhost:8888/products/ajax_getCategoryProducts',
        params: {CategoryId: $localStorage.CategoryId}
    })
    .success(function(data){
        $scope.Products = data;
        $localStorage.Products =  data;
    });
}
});
app.controller('productsPanel', function($scope, $location, $http, $localStorage){
$scope.Products = $localStorage.Products;
});
/* END CONTROLLERS */

当调用getcategoryproducts时,您所指向的产品数组可能会被清除。你能修复ajax_getCategoryProducts的回调并将success更改为将元素推入数组而不是重新分配吗。

.success(function(data){
        $scope.Products.length=0;
        data.forEach(function(p) { 
           $scope.Products.push(p);
        });
        $localStorage.Products =  $scope.Products;
    });