出于某种原因,当我按下“添加”按钮时,我的后端添加了一个空值。我不知道原因......我试图通过 console.log() 在它的回调中调试它,它给了我我输入的实际字符串......?怎么了?
基本上,如果您仍然感到困惑:它添加了值..但它添加了一个空字符串。这是一个待办事项应用程序
索引.html:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title></title>
<link href="lib/ionic/css/ionic.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
<link href="css/ionic.app.css" rel="stylesheet">
-->
<!-- Backand SDK for Angular -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script src="https://code.angularjs.org/1.4.9/angular.js"></script>
<script src="//cdn.backand.net/backand/dist/1.8.2/backand.min.js"></script>
<!-- ionic/angularjs js -->
<script src="lib/ionic/js/ionic.bundle.js"></script>
<!-- cordova script (this will be a 404 during development) -->
<script src="cordova.js"></script>
<!-- your app's js -->
<script src="js/app.js"></script>
</head>
<body ng-app="starter" ng-controller = "AppCtrl">
<ion-header-bar class="bar-positive">
<h1 class="title">My Backand Todo List</h1>
</ion-header-bar>
<ion-content class="has-header">
<input type="text" placeholder="New Todo" id = "todo" ng-model = "description"/>
<input type = "button" ng-click = "create();" value = "ADD"/>
<ion-list can-swipe="true">
<ion-item ng-repeat="item in todos">
{{item.name}}
<ion-option-button class="button-assertive" ng-click="delete(item.id)">
Delete
</ion-option-button>
</ion-item>
</ion-list>
</ion-content>
</body>
</html>
应用程序.js:
angular.module('starter', ['ionic', 'backand'])
.config(function (BackandProvider) {
BackandProvider.setAppName('todos');
BackandProvider.setAnonymousToken('6956403d-1b7c-4455-9539-df04125f2c70');
})
.controller('AppCtrl', ["$scope", "TodoService","$http","Backand" ,function($scope, TodoService, $http, Backand) {
$scope.create = function () {
var newTodo = {'description': $('#todo').val()}
return $http({
method: 'POST',
url : Backand.getApiUrl() + '/1/objects/' + 'todos',
data: newTodo,
params: {
returnObject: true
}
}).then(function(response) {
getTodo();
console.log($("#todo").val())
return response.data;
});
};
function getTodo (){
TodoService.getTodos()
.then(function (result) {
$scope.todos = result.data.data;
});
}
$scope.delete = function (todo) {
return $http({
method: 'DELETE',
url : Backand.getApiUrl() + '/1/objects/' + 'todos' + '/' + todo
}).then(function(response) {
console.log( response.data );
getTodo();
});
};
getTodo()
}]
)
.service('TodoService', function ($http, Backand) {
var baseUrl = '/1/objects/';
var objectName = 'todos';
function getUrl() {
return Backand.getApiUrl() + baseUrl + objectName;
}
function getUrlForId(id) {
return getUrl() + id;
}
getTodos = function () {
return $http.get(getUrl());
};
addTodo = function(todo) {
return $http.post(getUrl(), todo);
}
deleteTodo = function (id) {
return $http.delete(getUrlForId(id));
};
return {
getTodos: getTodos,
addTodo: addTodo,
deleteTodo: deleteTodo
}
});