1
所以，我做了一個待辦事項列表使用angularjs，並作出api使用php slim framework和mysql任務存儲。 我試圖使用$http服務來保存/刪除/更新數據庫中的任務，到目前爲止，我想出了這個（代碼如下），但由於我不是這方面的專家，所以可能有很多關鍵錯誤。
請記住，有關待辦事項列表的代碼正常工作，我希望爲$http請求提供一些指導和提示。
JS：
var app = angular.module('todoApp', []);
app.controller('TodoListController', ['$scope', '$http', function ($scope, $http) {
$scope.todos = [];
$scope.newField = [];
$scope.customStyle = {};
$scope.date = new Date();
$http({
method: 'POST',
url: 'http://taskapi.dev/api/tasks/add' }).then(function successCallback (response) {
$scope.addTodo = function() {
$scope.todos.push({text: $scope.todoText, done: false, editing: false, date: new Date()});
$scope.todoText = '';
};
$scope.save = function (index) {
$scope.todos[index].editing = false;
$scope.todos[index].createdOn = new Date().getTime();
};
});
$http({
method: 'PUT',
url: 'http://taskapi.dev/api/tasks/update' }).then(function successCallback (response) {
$scope.editTodo = function (todo) {
todo.editing = true;
};
$scope.change = function (field) {
var todoIndex = $scope.todos.indexOf(field);
$scope.newField[todoIndex] = angular.copy(field);
$scope.todos[todoIndex].editing = true;
$scope.todos[todoIndex].LastModifyOn = new Date().getTime();
};
$scope.turnGreen = function (todo) {
todo.customStyle = {'background': 'green'};
};
$scope.turnYellow = function (todo) {
todo.customStyle = {'background': 'yellow'};
};
$scope.turnRed = function (todo) {
todo.customStyle = {'background': 'red'};
};
$scope.cancel = function (index) {
$scope.todos[index] = $scope.newField[index];
};
});
$http({
method: 'DELETE',
url: 'http://taskapi.dev/api/tasks/delete' }).then(function successCallback (response) {
$scope.delete = function() {
var oldTodos = $scope.todos;
$scope.todos = [];
angular.forEach(oldTodos, function (todo) {
if (!todo.done) $scope.todos.push(todo);
});
};
$scope.remove = function() {
$scope.todos.splice(this.$index, 1);
};
});
}]);
畫外，我認爲如果您從工廠/服務發送請求會更好。這個請求我可以提供給你的另一個提示是使用'$ http.post（）'，除了'$ http（{method：'POST'}）' –
首先，正如其他人所說的，你應該避免依賴控制器中的$ http服務。將這些依賴關係封裝到數據檢索服務中，並在您的控制器中使用這些方法。 – 10BitDev
其次，您將方法添加到$ scope服務到處。由於這些實質上就是您的控制器的「API」，我強烈建議將它們全部定義在文件頂部的單行賦值語句中，以便一目瞭然地瞭解您的控制器實際執行的操作。 – 10BitDev