AngularJS：仅在选中复选框时，将一个输入框的值复制到另一个输入框

我在购物车上工作，人们需要在同一页面填写2个相似的表格。 第一种forms是账单地址，第二种forms是送货地址。 两个表单都包含类似的输入元素，例如：

a）账单地址：姓名，地址第1行，地址第2行，国家，电话等

b）送货地址：姓名，地址第1行，地址第2行，国家，电话等

有一个复选框，上面写着“检查帐单邮寄地址和送货地址是否相同”。 因此， 如果仅在选中复选框时，我需要将数据从帐单地址复制到送货地址，即使用户更改了帐单地址，它也应自动将更改复制到送货地址。

我需要使用Angular JS来做这件事。 有人可以告诉我怎么做？

（编辑：我是Angular Js的新手，不知道从哪里开始）

Answer 1

您可以在表单中定义两个部分。 一个用于发货地址，另一个用于帐单地址。 在帐单邮寄地址中添加相同地址的复选框。

然后，您需要处理以下情况

• 如果选中复选框，则将送货地址复制到开票地址对象。
• 如果选中复选框，则禁用帐单地址编辑。
• 如果通过复选框选中来自送货地址的任何字段，请将其复制到开票地址对象。

这是一个例子

        
 
 
Shipping Address
 Name:  
 Street:  
 City:  
 State:  
 Pin:  
 Mobile:  
 
 
Billing Address
 Name:  
 Street:  
 City:  
 State:  
 Pin:  
 Mobile:  
 Same as Shipping Address Address 
 
 
    

Answer 2

干得好。 我正在为您提供简化的解决方案。

 // Code goes here var myApp = angular.module('myApp', []); myApp.controller('FooCtrl', function($scope) { $scope.billing = {}; $scope.shipping = {}; $scope.copyAddresses = function() { if ($scope.copyAddress) { $scope.shipping = angular.copy($scope.billing); } } $scope.$watch('billing', function(newValue) { if (newValue) { $scope.copyAddresses(); } }, true); }); 

        
Hello Plunker!
 
 
 
 Address 1 
  
 
 
 Address 2 
  
 
 
 City 
  
 
 
 
 
   Check if billing address and shipping address is same  
 
 
 
 
 Address 1 
  
 
 
 Address 2 
  
 
 
 City 
  
 
 
 
 
   

Answer 3

HTML：

  
 
 Billing address Address  
 
 Shipping address Address  
 
 Shipping address is same as billing address  
  

控制器：

  myApp.controller('MyCtrl', function($scope) { $scope.CheckClicked = function(){ debugger; if($scope.SameAddress){ $scope.Shipping = $scope.billing; } else{ $scope.Shipping = angular.copy($scope.Shipping); } }; }); 

小提琴

Answer 4

这个想法就像你可以为BillingAddress和ShippingAddress使用两个范围变量。

然后，您可以在复选框中使用’ng-checked’属性来获取已检查的事件，如果与复选框关联的模型为true，则必须将ShippingAddress AddressLine2替换为BillingAddress AddressLine2

Answer 5

试试这个：

JS：

 function MyCtrl($scope) { $scope.box1=""; $scope.copyIt = function (active) { if(active){ $scope.box2 = $scope.box1; } else { $scope.box2=""; } } } 

小提琴