[英]AngularJS: post data to server
I want to add data to my database using AngularJS. 我想使用AngularJS将数据添加到数据库中。 First I have to choose a category from a list of categories which I get from my server.
首先,我必须从服务器中获得的类别列表中选择一个类别。 After that a user can add a product to the database.
之后,用户可以将产品添加到数据库。 I tried accomplishing this using:
我尝试使用以下方法完成此操作:
AngularJS AngularJS
categories = angular.module('categories', []);
categories.controller("category",function($scope, $http){
var serviceBase = 'api/';
$http.get(serviceBase + 'categories').then(function (results) {
$scope.categories = results.data;
for(var i = 0; i < $scope.categories.length; i++){
var categories = $scope.categories[i];
}
$scope.product = function($scope, $http, $catID){
$http.post(serviceBase + 'productadd/3/1/Icetealemon/5').then(function(results){
});
}
});
});
HTML HTML
<table id="app2" ng-app="categories" ng-cloak="" class="table table-hover">
<tr >
<th colspan="5">Add product</th>
</tr>
<tr ng-form name="addproductForm" novalidate ng-controller="category">
<td colspan="1">
<select class="form-control m-b-10">
<option ng-repeat= "c in categories">{{c.categoryName}}</option>
</select>
</td>
<td colspan="1">
<select class="form-control m-b-10">
<option>Antwerpen</option>
<option>Leuven</option>
</select>
</td>
<td colspan="1">
<input type="text" class="form-control" placeholder="Name" ng-model="catID"></input>
</td>
<td colspan="1">
<input type="text" class="form-control" placeholder="Price" width="10%"></input>
</td>
<td colspan="1">
<input type="submit" class="btn btn-success" ng-click="product()"></input>
</td>
</tr>
</table>
I am not even using the ng-models to use the data of my html. 我什至没有使用ng-models使用我的html的数据。 It's still hard coded because it doesn't even work then.
它仍然是硬编码的,因为那时它甚至不起作用。 I am getting en error:
我收到错误消息:
TypeError: Cannot read property 'post' of undefined
TypeError:无法读取未定义的属性“ post”
What am i doing wrong with my $http.post? 我的$ http.post在做什么?
categories = angular.module('categories', []);
categories.controller("category",function($scope, $http){
var serviceBase = 'api/';
$http.get(serviceBase + 'categories').then(function (results) {
$scope.categories = results.data;
for(var i = 0; i < $scope.categories.length; i++){
var categories = $scope.categories[i];
}
$scope.product = function($scope, $http, $catID){
// NOTE: This '$http' is $scope.product function parameter
// variable `$http` not angular '$http'
$http.post(serviceBase + 'productadd/3/1/Icetealemon/5').then(function(results){
});
}
});
});
Remove $http
parameter from $scope.product
function. 从
$scope.product
函数中删除$http
参数。
Also, look at https://docs.angularjs.org/tutorial/step_05 about angular dependency issue during minification and how to solve it. 另外,请参阅https://docs.angularjs.org/tutorial/step_05关于缩小期间的角度依赖性问题以及如何解决它的问题。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.