Как НЕ получить один элемент в массиве, используя angularjs $ resource / $ http fetch? - PullRequest
Новая
       19

Как НЕ получить один элемент в массиве, используя angularjs $ resource / $ http fetch?

0 голосов
/ 26 мая 2019

У меня есть вид списка и подробный вид, отображаемые рядом на одном экране, и он работает нормально. Я ищу способ избежать выборки одного единственного элемента, который "в данный момент активен" в подробном представлении. Код в списке и подробные контроллеры, как показано ниже, могут публиковать разметку и т. Д. При необходимости.

I) detailsView 

'use strict';

angular.module('states.phones.detail')    
.controller('PhoneDetailCtrl', ['$scope', 'phoneService', '$http', '$stateParams', 'angularGridInstance', 'Phone',
    function($scope, phoneService, $http, $stateParams, angularGridInstance, Phone, ) {
        console.debug('[states.phones.detail.controller()]');



        Phone.query()
            .$promise
            .then(function(data) {

                $scope.phones = data;
                $scope.page = 0;
                $scope.loadingMore = false;

                $scope.select = function(phone) {
                    $scope.selected = phone;
                }
                $scope.selected = {};

                $scope.selected = Phone.get({ phoneId: $stateParams.phoneId }, function(phone) {
                    $scope.mainImageUrl = phone.images[0];
                });

                $scope.setImage = function(imageUrl) {
                    $scope.mainImageUrl = imageUrl;



                    $scope.loadingMore = false;

                    $scope.loadMore = function() {
                        for (var i = 0; i = $scope.page; i++) {
                            $scope.phones.push(i++)[i];
                        }




                    }

                }

                $scope.loadMore = function() {
                    for (var i = 0; i = $scope.page; i++) {
                        $scope.phones.push(i++)[i];
                    }

                    function select($scope, $rootScope) {
                        $scope.select = function() {
                            var phoneslist = angularGridInstance[this];

                            angularGridInstance.phones.refresh();
                            $scope.$broadcast('select()');
                        };
                    }

                    var promise = $http.get('static-assets/phones/phones.json', { params: { phoneId: 'phones' } });
                    promise.then(function(data) {
                        var phonesTmp = angular.copy($scope.phones);
                        phonesTmp = phonesTmp.concat(data.data);
                        $scope.phones = phonesTmp;

                        $scope.loadingMore = false;

                    }, function() {
                        $scope.loadingMore = false;
                    });

                    return promise;
                };
            })
    }
])

II) ListView: 

(function() {


    'use strict';

    angular.module('states.phones.list')


        .controller('PhoneListCtrl', ['$scope', 'phoneService', '$q', '$http', '$rootScope', "$localStorage", "$sessionStorage", 'angularGridInstance', 'Phone',
            function($scope, phoneService, $q, $http, $rootScope, $localStorage, $sessionStorage, angularGridInstance, Phone) {
                console.debug('[states.phones.list.controller()]');



                $scope.card = {};
                var phoneslist = angularGridInstance[this];
                $scope.page = 0;
                $scope.phones = [];
                $scope.loadingMore = false;

                $scope.loadMore = function() {
                    for (var i = 0; i = $scope.page; i++) {
                        $scope.phones.push(i++)[i];
                    }

                    function select($scope, $rootScope) {
                        $scope.select = function() {
                            var phoneslist = angularGridInstance[this];

                            angularGridInstance.phones.refresh();
                            $scope.$broadcast('select()');
                        };
                    }


                    var promise =
                        $http.get('static-assets/phones/phones.json', {
                            headers: {
                                'Content-Type': 'application/json'
                            },
                            params: { phoneId: 'phones' }
                        });
                    promise.then(function(data) {
                        var phonesTmp = angular.copy($scope.phones || []);
                        phonesTmp = phonesTmp.concat(data.data);
                        $scope.phones = phonesTmp;

                        $scope.loadingMore = false;

                    }, function() {
                        $scope.loadingMore = false;
                    });

                    return promise;
                };
                $scope.loadMore();

            }


        ]);
}());

1 Ответ

1 голос
/ 26 мая 2019

Следует избегать техники замены функций на лету.Он запутывает состояние и функции таким образом, что затрудняет понимание, отладку, тестирование и обслуживание кода.XHR должны помещать данные только в область, а не в функции.

Как исключить один элемент из списка, если он уже «активен» в detailsView?

IЯ более склонен выделять активный элемент в списке.Я бы тоже отключил обработчик кликов, а не добавлял и удалял его. 

<div ng-repeat="item in list" ng-class="{highlight: $index == active}">
     {{item.name}}
     <button ng-disabled="active == $index" ng-click="showDetail(item)">
        Show Detail
     </button>
</div>
...