如果选中复选框，则绑定文本框值

Question

如何根据条件将文本框值传递给控制器。如果选中复选框，则将文本框与对象值绑定并传递给控制器，否则只需将其留空并将用户输入传递给控制器。我正在做的是行不通的。我的代码有什么问题，如果选中复选框，它就可以正常工作。

$scope.Product = [
        {"ProductID":12,"LNumber":"hrx",weght:"2"},
        {"ProductID":13,"LNumber":"pty",weght:"1"}
    ]

<div>
<div>
  <input type="checkbox" data-ng-model="Copyknotes" />
  <span >Copy notes from</span>
</div>

<table data-ng-repeat="Item in Product track by $index">                                          
   <tr >
     <td>                                              
        <input type="radio" name="groupName_{{Item.ProductID}}"  data-ng-model ="Item.isSelected"  />
     </td>
     <td data-ng-if="Copyknotes == true">
       <input type="text" data-ng-model="Item.LNumber">
      </td>
      <td data-ng-if="Copyknotes == false" id="hi">
      <input type="text" data-ng-model="Item.LNumber=""">
       </td>
       </tr>
</table>
</div>

Answer 1

使用scope.function

<input type="checkbox" data-ng-model="Copyknotes" ng-change="changeValue(Copyknotes)" />

//Code should be inside Angular js controller
$scope.changeValue = function(Copyknotes){
   if(Copyknotes)
   {
     //Manipulate text box value here
     $scope.Item.LNumber = 'whatever';
   }
}

Answer 2

这是一个例子： https://plnkr.co/edit/3Vtl6roWfL1ZqaR2nEvf

<td data-ng-if="Copyknotes == false">
    <input type="text" data-ng-model="Item.NNumber" ng-init="Item.NNumber = ''">
</td>

表达式错误 - data-ng-model="Item.LNumber="""" - 如果你想分配一个新值，你可以使用 Item.LNumber = "''"（双引号内有两个单引号）以避免干扰标签属性“”符号。我已经做了一个活生生的例子来说明如何做到这一点。不知道您的控制器是否需要输入的原始值，因此新值（未选中复选框时）改为保存到 NNumber。如果需要，您可以自由地将它们更改为 LNumber。此外，当输入呈现在视图中时，ng-init 指令用于启动对象的 NNumber 参数。您还应该定义 Copyknotes 进行比较。或者像 ng-if="Copyknotes", ng-if="!Copyknotes".

这样写你的条件

Answer 3

<input type="checkbox" data-ng-model="Copyknotes" ng-change="changeValue(Copyknotes)" />

首先删除 data-ng-model 并使用以下内容：

      //Code should be inside Angular js controller
        var oninput = null;
        $scope.changeValue = function(Copyknotes){
           if(Copyknotes)
           { 
             var oninput = document.getElementById("textbox").onchange =function(){
       $scope.item.LNumber = this.value;
           }
             //Manipulate text box value here

           }else{
             $scope.Item.LNumber = '';
             oninput = null 
           }
        }

Answer 4

只需使用

data-ng-init=""

而不是

data-ng-model="Item.LNumber="""

使用

data-ng-model="Item.LNumber"


<table data-ng-repeat="Item in Product track by $index">                                          
   <tr >
     <td>                                              
        <input type="radio" name="groupName_{{Item.ProductID}}"  data-ng-model ="Item.isSelected"  />
     </td>
     <td data-ng-if="Copyknotes == true">
       <input type="text" data-ng-model="Item.LNumber">
      </td>
      <td data-ng-if="Copyknotes == false" id="hi">
      <input type="text" data-ng-model="Item.LNumber" data-ng-init="">
       </td>
       </tr>
</table>

如果选中复选框，则绑定文本框值

bind a textbox value if checkbox is checked

javascript

angularjs

ng-repeat