2017-05-17 3 views
0

AngularJSを初めて使用しました。私は、私のシナリオでangular.copyに問題があります。私は、名前、携帯電話、州、地区、市などの特定のフィールドを持つフォームを持っています。ユーザーが州を選択すると、それに応じて地区が検索されます。都市と同じ。ここでは、状態と地区のフィールドにng-changeを使用しています。データを追加している間、正常に動作しています。特定のレコードを編集するとき、私はangular.copyを使用しています。それで、名前、移動体、状態のような独立したフィールドだけが完全にコピーされます。しかし、地区と都市はコピーされていません。この問題を解決するために私を助けてください。angular.copyは、別のフィールドに依存するフィールドでは機能しません(ng-changeを使用する場合)

私のHTMLフォームです。ここで

<div ng-controller="EmpController"> 
<form name="empForm" id="empForm" ng-submit="addEmp(emps)"> 
    Employee ID: <input type="text" class="form-control" id="empid" name="empid" ng-model="emps.empid" required /><br> 

    Role: <select class="form-control" id="role" name="role" ng-model="emps.role" ng-options="roles.role as roles.role for roles in rolelist" required> 
      <option value="">Select</option> 
     </select><br> 
    State: <select class="form-control" id="state" name="state" ng-model="data.state" ng-options="states.state as states.state for states in statelist" required ng-change="getDistricts(data.state)"> 
      <option value="">Select</option> 
      </select><br> 
    District: <select class="form-control" id="district" name="district" ng-model="data.district" ng-options="districts.district as districts.district for districts in districtlist" required ng-change="getCities(data)"> 
       <option value="">Select</option> 
      </select><br> 
    City: <select class="form-control" id="city" name="city" ng-model="data.city" ng-options="cities.city as cities.city for cities in citylist" required ng-change="getAreas(data)"> 
      <option value="">Select</option> 
     </select><br> 
    Area: <select class="form-control" id="area" name="area" ng-model="data.area" ng-options="areas.area as areas.area for areas in arealist" required> 
      <option value="">Select</option> 
     </select><br> 
    <input type="submit" class="btn" value="Add"> 
</form> 
<table class="table table-striped"> 
    <thead> 
    <th>Employee ID</th> 
    <th>Role</th> 
    <th>State</th> 
    <th>District</th> 
    <th>City</th> 
    <th>Area</th> 
    <th>Action</th> 
    </thead> 
    <tbody> 
    <tr ng-repeat="emps in emplist"> 
     <td>{{emps.empid}}</td> 
     <td>{{emps.role}}</td> 
     <td>{{emps.state}}</td> 
     <td>{{emps.district}}</td> 
     <td>{{emps.city}}</td> 
     <td>{{emps.area}}</td> 
     <td> 
     <button class="btn btn-primary glyphicon glyphicon-edit" ng-click="editEmp(emps,$index);"></button> 
     <button class="btn btn-danger glyphicon glyphicon-trash" ng-click="deleteEmp(emps._id,$index);" style="margin-left:10px;" ng-if="emps.empid.toLowerCase()!='admin'"></button> 
     </td> 
    </tr> 
    </tbody> 
</table> 
</div> 

は私controller.js私の理解あたりとして

app.controller("EmpController", function($scope, EmpService, RoleService, StateService, DistrictService, CityService, AreaService) { 
$scope.rolelist=RoleService.getRole(); 
$scope.emplist=EmpService.getEmp(); 
$scope.statelist=StateService.getState(); 
$scope.getDistricts=function(state) { 
    $scope.districtlist=DistrictService.getDistricts(state); 
} 
$scope.getCities=function(sds) { 
    $scope.citylist=CityService.getCities(sds); 
} 
$scope.getAreas=function(list){ 
    $scope.arealist=AreaService.getAreas(list); 
} 
$scope.editEmp=function(id,index){ 
    $scope.emps=angular.copy(id); 
    flag=index; 
} 
$scope.addEmp=function(emp){ 
    $scope.emps.pronarea=$scope.pronarealist; 
    if(!$scope.emps._id){ 
     console.log(emp); 
     EmpService.addEmp(emp); 
     $scope.emps={}; 
    } 
    else{ 
     EmpService.updateEmp(emp,flag); 
    } 
} 
$scope.deleteEmp=function(id,index){ 
    EmpService.deleteEmp(id,index); 
} 
}); 

答えて

1

で、オブジェクトをコピーした後、次のような、今の状態に基づいて状態を、取得の地区を取得し、あなたのリストにそれを割り当てますその後

$scope.editEmp=function(id,index){ 
$scope.emps=angular.copy(id); 
    $scope.districtlist=DistrictService.getDistricts(id.state); 
//some stuff here to get the cities based on the district you get if match then get the city from below code 
    $scope.citylist=CityService.getCities(id.city); 
flag=index; 
} 

モデルにそれらの値を代入

関連する問題