我正在尝试使用 $scope.passenger.firstName 从表单数据从视图到控制器.js检索乘客 .firstName。但是每次我在控制台中收到以下错误时：可能有什么问题？
TypeError: Cannot read property 'firstName' of undefined
at Scope.$scope.proceedARS (controller.js:2138)
at fn (eval at compile (angular.js:14819), <anonymous>:4:221)
at expensiveCheckFn (angular.js:15908)
at callback (angular.js:25887)
at Scope.$eval (angular.js:17684)
at Scope.$apply (angular.js:17784)
at HTMLButtonElement.<anonymous> (angular.js:25892)
at HTMLButtonElement.dispatch (jquery.min.js:3)
at HTMLButtonElement.r.handle (jquery.min.js:3)
(anonymous) @ angular.js:13922
jsp 视图如下：它从表单字段中获取 passenger.firstName，并在按钮上单击 ng 单击将其重定向到控制器.js中的proceedARS()功能。但是当我单击{{loadingButtonProceed}}时，它只是调用loadingFunction()并不断显示加载标志并卡住。
<div data-ng-repeat="passenger in passengerList track by $index">
<div class="row">
<div class="col-md-12">
<h4 class="text-primary">
<strong>Passenger Details</strong>
</h4>
</div>
<div class="col-md-3">
<label for="">Type <font color="red">*</font><select type="text"
ng-model="passenger.paxType" class="form-control-sm" ng-disabled="true">
<option value="ADULT" ng-selected="passenger.paxType == 'ADULT'" >Adult</option>
<option value="CHILD" ng-selected="passenger.paxType == 'CHILD'">Child</option>
<!-- <option value="INFANT">Infant</option> -->
</select>
</label>
</div>
<div class="col-md-3">
<label for="">Title <font color="red">*</font><select type="text"
ng-model="passenger.title" class="form-control-sm">
<option value="Mister">Mr.</option>
<option value="Miss">Ms.</option>
<option value="Mrs" ng-show="passenger.paxType == 'ADULT' " >Mrs.</option>
</select>
</label>
</div>
<div class="col-md-3">
<label for="">First Name <font color="red">*</font><input type="text"
ng-model="passenger.firstName" class="form-control-sm"></label><br>
</div>
<div class="col-md-3">
<label for="">Last Name <font color="red">*</font><input type="text"
ng-model="passenger.lastName" class="form-control-sm"></label>
</div>
<div class="clearfix"></div>
<div class="col-md-4">
<label for="">Nationality <font color="red">*</font><select type="text"
ng-model="passenger.nationality" class="form-control-sm">
<option value="" selected disabled>Select
Nationality</option>
<option value="NP">Nepalese</option>
<option value="IN">Indian</option>
<%-- <c:forEach var="nationality" items="${nationality}">
<option value="NP">${nationality}</option>
</c:forEach> --%>
</select>
</label>
</div>
<div class="col-md-8">
<label for="">Remarks <input type="text"
ng-model="passenger.paxRemarks" class="form-control-sm">
</label>
</div>
</div>
<div class="divider-h"></div>
</div>
<div class="row">
<div class="col-md-12 text-right">
<!-- <button class="btn btn-xs btn-default">+ Add Passenger</button> -->
</div>
</div>
<div class="clearfix"></div>
</div>
</div>
<div class="col-md-2 pull-right" style="margin-top: 20px;">
<button class="btn btn-primary btn-block" ng-disabled="disabled" ng-click="proceedARS()">{{loadingButtonProceed}}</button>
</div>
<!-- <div class="col-md-2 pull-right" style="margin-top: 20px;">
<button class="btn btn-default btn-block" ng-disabled="disabled" ng-click="backToSecondARS()">Back</button>
</div> -->
<div class="col-md-2 pull-right" style="margin-top: 20px;">
<button class="btn btn-warning btn-block" ng-disabled="disabled" ng-click="newPayment()">Abort</button>
</div>
控制器.js如下所示：
$scope.proceedARS = function () {
$scope.ARSMessage = '';
//$scope.passenger = {firstName, lastName};
if ($scope.contactName === undefined || $scope.contactName === null || $scope.contactName === "") {
$scope.ARSMessage = 'Please fill all the required fields';
console.log("Error from contactName");
return;
}
if ($scope.contactEmail === undefined || $scope.contactEmail === null || $scope.contactEmail === "") {
$scope.contactEmail = "";
console.log("Error from contactEmail");
}
if ($scope.contactNumber === undefined || $scope.contactNumber === null || $scope.contactNumber === "") {
$scope.ARSMessage = 'Please fill all the required fields';
console.log("Error from contactNumber");
return;
}
if ($scope.passenger.firstName === undefined || $scope.passenger.firstName === null || $scope.passenger.firstName === "") {
$scope.ARSMessage = 'Please fill all the required fields';
console.log("Error from P firstName");
}
if ($scope.passenger.lastName === undefined || $scope.passenger.lastName === null || $scope.passenger.lastName === "") {
$scope.ARSMessage = 'Please fill all the required fields';
console.log("Error from P lastName");
}
if ($scope.passenger.nationality === undefined || $scope.passenger.nationality === null || $scope.passenger.nationality === "") {
$scope.ARSMessage = 'Please fill all the required fields';
console.log("Error from P nationality");
}
if ($scope.contactNumber.length != 9 && $scope.contactNumber.length != 10) {
$scope.ARSMessage = 'Contact Number Length Invalid';
return;
}
if ($scope.selectedOutbound == undefined || $scope.selectedOutbound == "" || $scope.selectedOutbound == null) {
$scope.ARSMessage = "Please select one of the flights for departure";
return;
}
if ($scope.flightAvailability.tripType == 'R') {
if ($scope.selectedInbound == undefined || $scope.selectedInbound == "" || $scope.selectedInbound == null) {
$scope.ARSMessage = "Please select one of the flights for arrival";
return;
}
}
$scope.loadingFunction();
// console.log("Total size: " + $scope.size);
var outBoundFlightId = $scope.selectedOutbound.flightId;
var totalAmountOutBound = $scope.selectedOutbound.adultFare * $scope.selectedOutbound.adult * 1 + $scope.selectedOutbound.childFare * $scope.selectedOutbound.child * 1 + $scope.selectedOutbound.infantFare * $scope.selectedOutbound.infant * 1 + $scope.selectedOutbound.fuelSurcharge * $scope.size * 1 + $scope.selectedOutbound.tax * $scope.size * 1;
var taxOutBound = $scope.selectedOutbound.tax * $scope.size * 1;
var agencyCOutBound = $scope.selectedOutbound.agencyCommission * $scope.size * 1;
此外，在 ng 单击时传递乘客对象，如下所示，
在 HTML 中，
<button class="btn btn-primary btn-block" ng-disabled="disabled" ng-click="proceedARS(passenger)">{{loadingButtonProceed}}</button>
在控制器中，
$scope.proceedARS = function (passenger) {
$scope.ARSMessage = '';
$scope.passenger = passenger;
if ($scope.contactName === undefined || $scope.contactName === null || $scope.contactName === "") {
$scope.ARSMessage = 'Please fill all the required fields';
console.log("Error from contactName");
return;
}
if ($scope.contactEmail === undefined || $scope.contactEmail === null || $scope.contactEmail === "") {
$scope.contactEmail = "";
console.log("Error from contactEmail");
}
if ($scope.contactNumber === undefined || $scope.contactNumber === null || $scope.contactNumber === "") {
$scope.ARSMessage = 'Please fill all the required fields';
console.log("Error from contactNumber");
return;
}
if ($scope.passenger.firstName === undefined || $scope.passenger.firstName === null || $scope.passenger.firstName === "") {
$scope.ARSMessage = 'Please fill all the required fields';
console.log("Error from P firstName");
}
if ($scope.passenger.lastName === undefined || $scope.passenger.lastName === null || $scope.passenger.lastName === "") {
$scope.ARSMessage = 'Please fill all the required fields';
console.log("Error from P lastName");
}
if ($scope.passenger.nationality === undefined || $scope.passenger.nationality === null || $scope.passenger.nationality === "") {
$scope.ARSMessage = 'Please fill all the required fields';
console.log("Error from P nationality");
}
if ($scope.contactNumber.length != 9 && $scope.contactNumber.length != 10) {
$scope.ARSMessage = 'Contact Number Length Invalid';
return;
}
if ($scope.selectedOutbound == undefined || $scope.selectedOutbound == "" || $scope.selectedOutbound == null) {
$scope.ARSMessage = "Please select one of the flights for departure";
return;
}
if ($scope.flightAvailability.tripType == 'R') {
if ($scope.selectedInbound == undefined || $scope.selectedInbound == "" || $scope.selectedInbound == null) {
$scope.ARSMessage = "Please select one of the flights for arrival";
return;
}
}
$scope.loadingFunction();
// console.log("Total size: " + $scope.size);
var outBoundFlightId = $scope.selectedOutbound.flightId;
var totalAmountOutBound = $scope.selectedOutbound.adultFare * $scope.selectedOutbound.adult * 1 + $scope.selectedOutbound.childFare * $scope.selectedOutbound.child * 1 + $scope.selectedOutbound.infantFare * $scope.selectedOutbound.infant * 1 + $scope.selectedOutbound.fuelSurcharge * $scope.size * 1 + $scope.selectedOutbound.tax * $scope.size * 1;
var taxOutBound = $scope.selectedOutbound.tax * $scope.size * 1;
var agencyCOutBound = $scope.selectedOutbound.agencyCommission * $scope.size * 1;