Доброе утро всем экспертам. У меня появилась проблема - на 1 странице не repeat'ятся данные из JSON файла (хотя если задать ил локально в самом контроллере - все работает) И Проблема по важнее - на 2 странице идет загрузка template, но не кнопка не реагирует, я думал проблема в том, что в template я не указал controller но так как он задан функцией не знаю как это сделать.
Ошибок в консоли нету. А на xhr видно, что на загрузке json 304 Not Modified - помогите, я уже не знаю даже где искать проблему, хотя бы с загрузкой данных.
Может это связано как то с live-server и его параметрами, просто прошу, помочь найти проблему!
1-я проблема - модуль:
angular.module('invoicesList', ['ngRoute', 'addInvoices']);
Это template:
<div class="container">
<div class="heading">
<h1>Invoices</h1>
</div>
<div class="actions">
<div class="wrapper">
<h2>Actions</h2>
<a href="#!/addInvoices"><input type="button" value="Add new"></a>
</div>
</div>
<div class="table-invoices">
<h2>Invoices</h2>
<table class="table">
<thead class="thead-inverse">
<tr>
<th>Create</th>
<th>No</th>
<th>Supply</th>
<th>Comment</th>
</tr>
</thead>
<tbody ng-repeat="invoice in $ctrl.invoices">
<th>{{invoice.date_created}}</th>
<td>{{invoice.number}}</td>
<td>{{invoice.date_supply}}</td>
<td>{{invoice.comment}}</td>
</tbody>
</table>
</div>
</div>
Это Component :
angular.module('invoicesList').component('invoicesList', {
templateUrl: 'invoices/invoices.template.html',
controller: ['$http', function InvoicesListController($http) {
var self = this;
$http.get('invoices-list/invoices.json').then(function(response) {
self.invoices = response.data;
});
}]
});
2-я проблема - Модуль :
angular.module('addInvoices', ['ngRoute']);
Component :
angular.module('addInvoices').component('addInvoices', {
templateUrl: 'add-invoices/add-invoices.template.html',
controller: ['$routeParams', '$http', '$scope',
function AddInvoicesController($routeParams, $scope, $http) {
this.addInvoices = $routeParams.addInvoices;
$scope.addNewInvoice = function(add) {
$http({
method : 'POST',
url : 'invoices-list/invoices.json'
}).then(function(response){
$scope.data = response.data;
$scope.data.push(add.comment, add.number, add.date_supply);
}, function(response){
});
};
}
]
});
Template :
<div class="container create">
<div class="heading">
<h1>Creat invoice</h1>
</div>
<div class="wrapper form-container">
<form>
<div class="row">
<div class="col-6">
<div class="form-group">
<label for="formNumber">Number:</label>
<input ng-model="add.number" type="text" class="form-control" id="formNumber" placeholder="Enter number">
</div>
<div class="form-group">
<label for="formSupplyDate">Supplay Date: </label>
<input ng-model="add.date_supply" type="text" class="form-control" id="formSupplayDate" placeholder="Select date">
</div>
</div>
<div class="col-6">
<div class="form-group">
<label for="formDate">Invoice Date: </label>
<input type="text" name="Date" id="formDate" class="form-control" placeholder="Select date">
</div>
</div>
</div>
<div class="form-group">
<label for="formComment">Comment: </label>
<textarea ng-model="add.comment" name="Comment" id="formComment" cols="50" rows="3" placeholder="Write..." class="form-control"></textarea>
</div>
</form>
</div>
<div class="button-save d-flex justify-content-end">
<a href="#!/invoices"><button class="btn btn-primary" ng-click="addNewInvoice(add)">Save</button></a>
</div>
</div>
В данном вопросе ошибка с GET запросом JSON файла заключалась в ошибочном синтаксисе внутри функции success
. Требовалось заменить строчку self.invoices = response.data;
на self.invoices = response.data.invoices;
Мелкая, но грубая ошибка - которая привела к часам поисков.
Запрос POST - это скорее не ошибка, а отсутствие back-end части. Так как мой код не содержит данной части, мой сервер не обрабатывает запрос.
Кофе для программистов: как напиток влияет на продуктивность кодеров?
Рекламные вывески: как привлечь внимание и увеличить продажи
Стратегії та тренди в SMM - Технології, що формують майбутнє сьогодні
Выделенный сервер, что это, для чего нужен и какие характеристики важны?
Современные решения для бизнеса: как облачные и виртуальные технологии меняют рынок
На странице сайта выводится обратный таймер ЧЧ:ММ:ССИз этих данных я отсекаю только СС
я не могу сделать так, чтобы при нажатии на блок, цвет его краёв менялся на другой цвет, используяanimate(), ничего не выходит! (2 строка с данного...
Данный код должен закрывать меню если целью клика не является блок с менюНо если клик именно по данному блоку то функция останавливается,...
Всем приветЗадача такая - нужно при клике по ссылке сестринскому элементу span присваивать класс badge-danger, в то же время если у сестринских элементов...