On the page made with angular, when you switch to the product, a page opens on which the carousel with the initially necessary product.

I get the goods not in one json.

Is it possible for ng-repeat to display products from different json-files depending on the identifier? Or maybe there is a much simpler solution?

CONTROLLER

[velesApp.controller('KitchenDetailCtrl', ['$scope','$http', '$location', '$routeParams', function($scope, $http, $location, $routeParams) { $scope.kitchenId = $routeParams.kitchenId; var url = 'kitchens/'+$routeParams.kitchenId+'.json'; $http.get(url).success(function(data) { $scope.kitchendet = data; });

HTML

 <slick ng-repeat="kitchendet in kitchendets "> <h2 class="text-center"> {{kitchendet.name}}

ROUTING

 .when('/kitchens/:kitchenId', { templateUrl:'template/kitchen-detail.html', controller:'KitchenDetailCtrl' })
  • what do you mean by different jason ? - Grundy
  • I receive each item in a separate Jason file - Andrey Fedorovich
  • several options, from loading all products to loading them at the touch of a button for example. ng-repeat only works with the array / object that you gave it, but you can modify this array / object and ng-repeat will update the html. For a specific solution, you need more information, your code, how you store the goods. Why not in the list of products for example? - Grundy
  • Paste the code into your question so that it is immediately visible and can be formatted - Grundy
  • and html markup - Grundy

1 answer 1

Not the right approach to implementation, you need to use the service, not the best implementation, but as an example, my service will come down, but in general I am doing now through ngresource. In the Controller, it remains only to check whether the ID came in, if there is, then we take 1 record from Projects.items, if there is no data in the items, try downloading them from the server. Post takes me away from me because I still pass the parameters for cropping images, in your case, get will be enough.

 questServices.factory('Projects', ['$http', '$timeout', 'Upload', function ($http, $timeout, Upload) { var service = function (editor) { this.items = []; this.busy = false; this.after = ''; this.page = ''; this.end = false; this.new_project = {}; this.getClass = 'btn-default'; this.setdelete = null; }; service.prototype.save = function () { if (this.busy) return; this.busy = true; var file = this.new_project.image; file.upload = Upload.upload({ url: '/resource/addproject', data: {file: file, project: JSON.stringify(this.new_project)}, }); file.upload.then(function (response) { this.busy = false; console.log(response.data); this.new_project = {}; this.getClass = 'btn-success'; this.load(); $timeout(function () { this.getClass = 'btn-default'; this.busy = false; }.bind(this), 2000); }.bind(this), function (response) { //this.busy = false; //console.log('test'); //console.log(response.data); }, function (evt) { // Math.min is to fix IE which reports 200% sometimes file.progress = Math.min(100, parseInt(100.0 * evt.loaded / evt.total)); console.log(file.progress); }); } service.prototype.load = function (params, callback) { if (this.busy) return; this.busy = true; var url = "resource/projects"; $http.post(url, params). then(function (response) { console.log(response.data); this.items = response.data.projects; this.busy = false; $timeout(function () { if (typeof callback == 'function') callback(); }.bind(this), 1000); }.bind(this), function (response) { console.log(response); }); }; service.prototype.delete = function () { if (this.busy) return; this.busy = true; var url = "resource/deleteproject/" + this.setdelete.id; $http.get(url). success(function (data, status, headers, config) { console.log(data); angular.forEach(this.items, function (item, key) { if (item.id == this.setdelete.id) { this.items.splice(key, 1); } }.bind(this)); this.setdelete = null; this.busy = false; }.bind(this)). error(function (data, status, headers, config) { }); }; service.prototype.update = function () { if (this.busy) return; this.busy = true; var url = "resource/updateproject"; var file = this.new_project.image; if (file) { console.log('Отправил через файл'); file.upload = Upload.upload({ url: url, data: {file: file, project: JSON.stringify(this.new_project)}, }); file.upload.then(function (response) { this.busy = false; console.log(response.data); this.getClass = 'btn-success'; this.load(); $timeout(function () { this.getClass = 'btn-default'; this.new_project = {}; this.busy = false; }.bind(this), 2000); }.bind(this), function (response) { //this.busy = false; //console.log('test'); //console.log(response.data); }, function (evt) { // Math.min is to fix IE which reports 200% sometimes file.progress = Math.min(100, parseInt(100.0 * evt.loaded / evt.total)); console.log(file.progress); }); } else { $http.post(url, {project: JSON.stringify(this.new_project)}). then(function (response) { console.log(response); this.getClass = 'btn-success'; $timeout(function () { this.getClass = 'btn-default'; this.busy = false; }.bind(this), 2000); }.bind(this), function (response) { console.log(response); }); } }; return service; } ]);