javascript - Angular 如何重新加载 Controller

Question

我有一个categoriesPanel Controller ，在ng-click上我想在我的ng-controller productsPanel中显示属于该类别的所有产品。我遇到的问题是，每次我单击 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 脚本，它从后端获取正确的数据，但当我刷新页面时，数据仅显示在 producsPanel Controller 中。我希望您在单击 ng 后立即显示数据。

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 */

Answer 1

也许当调用 getcategoryproducts 时，您指向的产品数组会变得清晰。您能否修复 ajax_getCategoryProducts 的回调并将 success 更改为将元素插入数组而不是重新分配。

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

    });