Почему не работает форма добавления товара?

Question

[Max]

Здравствуйте, подскажите пожалуйста почему не добавляется товар в файл JSON?
Форма добавления:

<form action="">
	Название <input type="text" ng-model="newData.name">
	Описание <input type="text" ng-model="newData.description">
	Страна производитель <input type="text" ng-model="newData.country">
	Калорийность <input type="text" ng-model="newData.calories">
	Цена <input type="text" ng-model="newData.price">
	Термин хранения <input type="text" ng-model="newData.termin">
	Дата изготовления <input type="text" ng-model="newData.data">
	<button ng-click="addProduct()">Добавить новый продукт</button>
</form>

Контроллер:

productApp.controller('ProductListCntrl',['$scope','$http','$location', function($scope, $http,$location){
	$http.get('products.json').success(function(data, status, headers, config){ // Посылаю запрос для получение данных, если успешно, то
		$scope.products = data; // products заношу все полученные данные
		$scope.addProduct = function(){ // В объект  addProduct записываю значение функции
			$scope.data.push($scope.newData); // в полученную информацию (переменная data) пушу значение newData из формы
			$scope.newData=''; // слабо понимаю что тут происходит)
		};
	});
}]);

Пример JSON:

[
    {
        "productId": "Milk", 
        "name": "Молоко", 
        "description": "Хорошее молоко",
        "country": "Украина",
        "calories": "220 Ккал",
        "price": 12,
        "termin": 3,
        "data": "12.05.2015"
    },

Answer 1

[Alexander Tartmin]

Во первых, есть ng-submit директива, а у вас калокод извините. Во вторых для того что бы сделать массив с объектом нужно его сначала в виде переменной запилить. Опишите конкретной задачу, я вам помогу.

Comments

[Max]

Общая задача такова, есть файл JSON в котором 7 продуктов. Нужно вытянуть эти данные из файла в массив, и создать форму добавления нового товара уже в этот массив.

[Alexander Tartmin]

Максим Череватов: без помощи сервера вы никак не напишете подобное, так как JS на клиенте в целях безопасности не сможет писать в файл. В качестве сервера возьмите NodeJS и на нем есть отличнейший фреймворк Keystone.js. там же вы сможете из БД уже себе на комп сохранять как в json так и в других форматах.

[Max]

Alexander Tartmin: Спасибо. К сожалению задачу сказали решить без посторонних средств)

[Alexander Tartmin]

Максим Череватов: ну тогда только скажу что сервис $http вам тут точно ничем не поможет.

[Alexander Tartmin]

Максим Череватов: как вариант вы можете гетать исходный json с сервера, изменять его в контроллере и скачивать средствами ангулара. Думаю такой способ решения будет изящней.

Answer 2

[_ _]

Т.е. вы этим кодом хотите добавить данные в файл products.json? Тогда у меня для вас плохие новости.
UPD:
У вас фундаментальные пробелы.
Никакого файла products.json в вашем коде не существует. Конструкция

$http.get('products.json').success(function(...){});

запрашивает с сервера данные по ссылке 'products.json', после чего преобразует полученные данные в объект JavaScript, и возвращает этот объект вам в качестве параметра data функции обратного вызова.
Вы ожидаете, что у вас в data придет некий объект, магически связанный с файлом products.json, сделав push в который вы обновите этот файл на сервере. Но это не так, вы всего лишь получаете локальный объект, содержащий данные, которые вам вернул сервер в ответ на GET-запрос.

Comments

[Max]

Да, хотелось бы добавить данные в JSON. А какая может быть альтернатива??

[_ _]

Максим Череватов: Напишите, пожалуйста, к каждой строчке вашего JS-кода, комментарий - что вы ожидаете получить в результате ее выполнения, не могу понять, в какой момент вы упускаете нить.

[Max]

Александр Марченко: Отредактировал. Код писал по уроку до "$scope.data.push($scope.newData);" так как там он данные заносил в массив, а мне нужно в JSON.

[_ _]

Максим Череватов Ну это все хорошо, но вы пишете "добавить в файл json". В какой момент вы ожидаете, что данные будут добавлены в файл? И в какой? products.json?

[Max]

Александр Марченко: в момент нажатия на кнопку "Добавить новый продукт" ; ) Я ожидаю что тогда строчка " $scope.data.push($scope.newData);" добавит новый товар в файл products.json

[_ _]

Максим Череватов теперь все понятно, отредактировал ответ

[Max]

Александр Марченко: Спасибо за объяснение! Я действительно многое не так понимаю.

Answer 3

[codingal]

У вас форма никак не привязана к контроллеру, нужно подключить и весь контроллер и отдельно метод addProduct на ng-submit