javascript - 以 Angular 形式将一个输入字段值连接(追加)到另一字段

Question

尝试将第一个输入字段值自动填充到第二个输入字段值中，但是，如果第二个输入字段作为现有值，那么我想将第一个输入字段值附加/连接到第二个输入字段值。

逻辑:

if ( second ){
second = first + second;
}else{
second = first;
}

html:

<input type='text' ng-model='owner' required class="form-control">
<input type='text' ng-model='member' required class="form-control">

代码:

app.controller("Controller", ['$scope', function($scope){

  $scope.$watch(function () {
    return $scope.owner;
},
function (newValue, oldValue) {
    if ( $scope.member ){
      $scope.member = $scope.owner + ',' + $scope.member;
    }else{
      $scope.member = newValue;
    }
}, true);

}]);

plunker

更新(问题):

当我在所有者字段中输入 Jake 时，它会循环遍历字母并在成员字段中打印为 Jake,Jak,Ja,J。如果我在成员字段中已有值 Adam，则在所有者字段中输入 Tom 后，它将在中创建 Tom,To,T,Adam成员(member)字段。请检查 plunker 的演示。

Answer 1

Mad-D 考虑改变你的方法，因为它很容易产生基于 ng-model 工作方式的循环依赖。

您已经可以访问这两个值，并且可以以其他方式显示它。另外，您的 Controller 看起来更干净，并且充当真正的 View 模型 (vm):

<强> Plunker

app.controller("Controller",  function(){

  var myCtrl = this;

  myCtrl.owner = "";
  myCtrl.member = "";

});