我还在努力了解AngularJS框架是如何运作的,所以请耐心等待。
我在使用BarcodeSave()方法保存数据方面遇到了问题,但是,从BarcodeItem()和BarcodeList()中检索数据没有问题。
到目前为止我所听到的(我可能是错的),$资源对于这个项目来说有点受限,这就是为什么我只对使用$ http感兴趣。虽然,我喜欢听听你的意见,无论如何。
ASP.NET/C#
public CsBarcode BarcodeSave(string barcodeVal, string courierType, string userName)
Saves to the database and returns JSON, IsSuccess = true for success or IsFailed = true if failed. The status will be in the Status field
Name: BarcodeSave
Returns: CsBarcode (JSON object)
Parameters
barcodeVal (string) – the value that came from the scanner
courierType (string) – the location, send constant: PICKUP or DROPOFF
userName (string) – the login name of the user. Will come from the Sign In page
public CsBarcode BarcodeItem(string barcodeVal, string userName)
Retrieves information from the database for one individual item matching by the barcode value
Name: BarcodeItem
Returns: CsBarcode (JSON object)
Parameters
barcodeVal (string) – the value that came from the scanner
userName (string) – the login name of the user. Will come from the Sign In page
public List<CsBarcode> BarcodeList(string userName)
Retrieves information from the database for all items by the courier - userName
Name: BarcodeList
Returns: List of CsBarcode (list of JSON objects)
Parameters
userName (string) – the login name of the user. Will come from the Sign In page
AngularJS - 工厂
//Factory to get Pick Up List
angular.module('app.pickUpServ', []).factory('pickUpServ', ['$http',
function($http) {
var params = "{'barcodeVal':'" + '12345678' +
"','courierType':'" + 'PICKUP' +
"','userName':'" + 'aspuser' + "'}";
return {
getPickUpList: function(data) {
$http({
method: 'POST',
url: 'app/Service/CourierService.asmx/BarcodeItem2',
data: params,
contentType: 'application/json; charset=utf-8',
dataType: 'json',
}).success(data).error(function (error) {
console.log('Error - getPickUpList');
});
},
updatePickUpList: function(data) {
$http({
method: 'POST',
url: 'app/Service/CourierService.asmx/BarcodeSave2',
contentType: 'application/json; charset=utf-8',
data: params,
dataType: 'json'
}).success(data).error(function (error) {
console.log('Error - updatePickUpList');
});
}
}
}
]);
AngularJS - 控制器
angular.module('app.scanListCtrl', []).controller('ScanListCtrl', ['$scope', '$rootScope', 'pickUpServ', function ($scope, $rootScope, pickUpServ) {
//Get Pick Up Data
pickUpServ.getPickUpList(function (data) {
$scope.items = data;
console.log(data);
});
} ]);
JSON
[
{
"Id":1,
"BarcodeValue":"99999999",
"CSN":"99999999",
"MRN":"99999999xxx",
"UserName":"steinan",
"FirstName":"Anthony",
"LastName":"Stein",
"DateProcessed":"9/1/2014",
"IsProcessed":false,
"IsSuccess”:false,
"IsFailed":true,
"Status":"Failed"
},
{ "Id":1,
"BarcodeValue":"88888888",
"CSN":"88888888",
"MRN":"88888888xxx",
"UserName":"davisnick",
"FirstName":"Nick",
"LastName":"Davis",
"DateProcessed":"8/1/2014",
"IsProcessed":true,
"IsSuccess”:true,
"IsFailed":false,
"Status":"Success"
}
]
HTML
<div ng-controller="ScanListCtrl">
<div class="row prepend-top-md">
<div class="col-lg-12">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">
<i class="fa fa-barcode"></i> Scan Item</h3>
</div>
<div class="panel-body">
<div class="input-group input-group-lg">
<input type="number" class="form-control" placeholder="Scan Item" ng-model="BarcodeValue"
ng-change="autoAddItem()" is-focus>
<span class="input-group-btn">
<button class="btn btn-info" type="button" ng-click="addRow()">
Add Barcode</button>
</span></div>
</div>
<table class="table table-striped table-hover">
<thead>
<tr>
<th class="text-center" style="width: 3%">
#
</th>
<th>
<i class="fa fa-barcode"></i> Barcode
</th>
<th>
<i class="fa fa-medkit"></i> CSN
</th>
<th>
<i class="fa fa-user"></i> User
</th>
<th>
<i class="fa fa-clock-o"></i> Date
</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="item in items | orderBy:'Id':true:reverse">
<td class="text-center">
[{{item.Id}}]
</td>
<td>
{{item.BarcodeValue}}
</td>
<td>
{{item.CSN}}
</td>
<td>
{{item.LastName + ', ' + item.FirstName}}
</td>
<td>
{{item.DateProcessed}}
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
答案 0 :(得分:0)
想出来! :)这是范围var问题。
pickUpServ - factory
angular.module('app.pickUpServ', []).factory('pickUpServ', ['$rootScope', '$http',
function ($rootScope, $http) {
var params = "{'barcodeVal':'" + '12345678' +
"','courierType':'" + 'PICKUP' +
"','userName':'" + 'aspuser' + "'}";
return {
items: [params],
getPickUpList: function (data) {
$http({
method: 'POST',
url: 'app/Service/CourierService.asmx/BarcodeList',
data: params,
contentType: 'application/json; charset=utf-8',
dataType: 'json',
}).success(data).error(function (error) {
console.log('Error - getPickUpList');
});
},
savePickUpList: function (item) {
this.items.push(item);
console.log(item);
console.log('item --- ' + JSON.stringify(item));
console.log('params --- ' + params);
$http({
method: 'POST',
url: 'app/Service/CourierService.asmx/BarcodeSave',
data: JSON.stringify(item),
contentType: 'application/json; charset=utf-8',
dataType: 'json',
}).success(function(data, status, headers, config){
console.log('Success! - updatePickUpList');
}).error(function (error) {
console.log('Error - updatePickUpList');
});
}
};
}
]);
ScanListCtrl - Controller
angular.module('app.scanListCtrl', []).controller('ScanListCtrl', ['$scope', 'pickUpServ', function ($scope, pickUpServ) {
//Get Pick Up Data
if ($scope.title == 'Pick Up') {
$scope.items = pickUpServ.items;
pickUpServ.getPickUpList(function (data) {
$scope.items = data.d
});
$scope.autoAddItem = function () {
if (($scope.BarcodeValue + '').length == 8) {
pickUpServ.savePickUpList({
"barcodeVal": $scope.BarcodeValue,
//CSN: $scope.BarcodeValue,
"courierType": "PICKUP",
"userName": "aspuser"
});
}
};
}
} ]);