Question

我有一个地址对象，而该对象又有嵌套对象，即永久和邮政。此地址是大表单的一部分，正在保存输入框的值，但不保存下拉列表（选择）值。我错过了什么？

index.view.html

 <div class="form-group" ng-class="{ 'has-error': form.address.$dirty && form.address.$error.required }">
    <label for="address" class="col-sm-2 control-label">Address</label>
    <div class="col-sm-5">
        <label style="padding-top:8px">Permanent Address</label><br>

        <textarea rows="5" cols="50" maxlength = "100" type="text" placeholder="Address Line1" class="form-control" ng-model="address.permanent.line1" ng-change="sameAsPermanent && update()" required> </textarea><br>

        <select class="form-control" ng-model="address.permanent.countryName" ng-options="country._id as country.countryName for country in countries" ng-change="sameAsPermanent && update()"></select><br>
        <select class="form-control" ng-model="address.permanent.countryCode" ng-options="country._id as country.countryCode for country in countries" onkeypress='return event.charCode >= 48 && event.charCode <= 57' ng-change="sameAsPermanent && update()"></select><br>
        <select class="form-control" ng-model="address.permanent.stateName" ng-options="country._id as country.stateName for country in countries" ng-change="sameAsPermanent && update()"></select><br>

        <select class="form-control" ng-model="address.permanent.city" ng-options="country._id as country.city for country in countries" ng-change="sameAsPermanent && update()"></select><br>

        <input type="text" class="form-control"  placeholder="Area" ng-model="address.permanent.locations.Area" ng-change="sameAsPermanent && update()" required><br> 
        <input type="text" class="form-control"  placeholder="Zip/Postal code" ng-model="address.permanent.locations.pincode" ng-change="sameAsPermanent && update()" required><br> 

    </div>

    <div class="col-sm-5">
        <label style="padding-top:8px">Postal Address</label>&nbsp;&nbsp;<input type="checkbox" ng-model="sameAsPermanent" ng-change="sameAsPermanent && update()">Same<br>
        <textarea rows="5" cols="50" maxlength = "100" type="text" placeholder="Address Line 1" class="form-control" ng-model="address.postal.line1" ng-disabled="sameAsPermanent" required> </textarea><br>                     

        <select class="form-control" ng-disabled="sameAsPermanent" ng-model="address.postal.countryName" ng-options="country._id as country.countryName for country in countries"></select><br>
        <select class="form-control" ng-disabled="sameAsPermanent" onkeypress='return event.charCode >= 48 && event.charCode <= 57' ng-model="address.postal.countryCode" ng-options="country._id as country.countryCode for country in countries"></select><br>
        <select ng-disabled="sameAsPermanent" class="form-control" ng-model="address.postal.stateName" ng-options="country._id as country.stateName for country in countries"></select><br>
        <select class="form-control" ng-disabled="sameAsPermanent" ng-model="address.postal.city" ng-options="country._id as country.city for country in countries"></select><br>
        <input type="text" class="form-control"  ng-disabled="sameAsPermanent" placeholder="Area" ng-model="address.postal.locations.Area" required><br> 
        <input type="text" class="form-control"  ng-disabled="sameAsPermanent" placeholder="Zip/Postal code" ng-model="address.postal.locations.pincode" required><br>                  
    </div>
</div>

index.controller.js

$scope.address={
    permanent:{
    },
    postal:{
    }
};

$http.get('http://student.herokuapp.com/address')
.success(function(response){

    // $scope.countries=response.address.countryName;

    countryLen=response.address.length;
    console.log(countryLen);

    for(var i=0;i<countryLen;i++){

        $scope.countries.push({ "countryName":response.address[i].countryName,
           "countryCode":response.address[i].countryCode,
           "stateName": response.address[i].states[i].stateName,
           "city": response.address[i].states[i].cities[i].city
       });
    }
});

$scope.save  = function() { 

    $http.put('https://student.herokuapp.com/personalInfo', {
        "name" : $scope.name,
        "dob" : $scope.dob,
        "gender" : $scope.gender,
        "address" : {
            "permanent" : {
                "line1" : $scope.address.permanent.line1,
                "zip" : $scope.address.permanent.locations.pincode, 
                "state" : $scope.address.permanent.stateName,
                "Country" : $scope.address.permanent.countryName
            },
            "postal" :    {
                "line1" : $scope.address.postal.line1,
                "zip" : $scope.address.postal.locations.pincode, 
                "state" : $scope.address.postal.stateName, 
                "Country" : $scope.address.postal.countryName
            }
        }
    ).success(function(response)
});

    **Address Json array**

 "address": {
  "permanent": {
    "line1": "MG Road",
    "zip": 403404,
    "state": "Goa",
    "Country": "Panjim"
  },
  "postal": {
    "line1": "MG Road 2",
    "zip": 403404,
    "state": "Goa",
    "Country": "Panjim"
  }

Answer 1

使用以下语法添加ng-options。

country.countryName as country.countryName for country in countries

永久地址部分的示例代码段

<select class="form-control" ng-model="address.permanent.countryName" ng-options="country.countryName as country.countryName for country in countries" ng-change="sameAsPermanent && update()"></select><br>
                      <select class="form-control" ng-model="address.permanent.countryCode" ng-options="country.countryCode as country.countryCode for country in countries" onkeypress='return event.charCode >= 48 && event.charCode <= 57' ng-change="sameAsPermanent && update()"></select><br>
                      <select class="form-control" ng-model="address.permanent.stateName" ng-options="country.stateName as country.stateName for country in countries" ng-change="sameAsPermanent && update()"></select><br>
<select class="form-control" ng-model="address.permanent.city" ng-options="country.city as country.city for country in countries" ng-change="sameAsPermanent && update()"></select><br>

为什么下拉列表中的值未被保存？

1 个答案: