Angular JS：在ng-repeat中绑定两个文本文件

我有和ng-重复一些lowValue和HighValue循环。Angular JS：在ng-repeat中绑定两个文本文件

1. LowValue1  HighValue1 
    2. LowValue2  HighValue2 
    3. LowValue3  HighValue3 
    . . . 
    n. LowValue n  HighValue n

在NG-重复是一样的东西：

<div ng-repeat="categoryObject in category.tiers track by $index"> 
     <div class="col-lg-3 "> 
       <label class="control-label" translate> From ($) </label> 
       <input type="number" class="form-control" ng-model="categoryObject.lowValue" > 
     </div> 
     <div class="col-lg-3 "> 
       <label class="control-label" translate> To ($) </label> 
       <input type="number" class="form-control" ng-model="categoryObject.highValue" > 
     </div> 
    </div>

我的要求是高价值1应该等于第二lowValue 和第2高价值应该等于3 lowValue和儿子..

如何绑定这两个数据？

来源

2015-10-14 JayKay

试图NG-绑定和ng-data-bind，但不工作.. :( – JayKay

我不清楚，你是说当他们在highValue中输入一个值时，ne xt row ng-model lowValue应该用相同的值更新？ –

这样的事情？第一个lowValue和最后一个highValue没有绑定。但其余的是相互依赖的。

http://jsfiddle.net/xc7czgfz/

var myApp = angular.module('myApp',[]).controller("MyCtrl",["$scope",function($scope) { 
 
    $scope.objs = [{lowValue:0,highValue:1},{lowValue:1,highValue:5},{lowValue:5,highValue:6}]; 
 
    $scope.handleChange = function(){ 
 
     console.log("handlechange"); 
 
     var index = arguments[0]; 
 
     var type = arguments[1]; 
 
     if(index!=null && type!=null){ 
 
      if(type == "low" &&(index > 0 && index< $scope.objs.length)){ 
 
        $scope.objs[index-1].highValue= $scope.objs[index].lowValue; 
 
      } 
 
      if(type == "high" &&(index >= 0 && index< ($scope.objs.length-1))){ 
 
        $scope.objs[index+1].lowValue= $scope.objs[index].highValue; 
 
      } 
 
     
 
     } 
 
     
 
    } \t 
 
     
 
}]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp"> 
 
    <div ng-controller="MyCtrl"> 
 
    
 
<div ng-repeat="obj in objs"> 
 
    <div class="col-lg-3 "> 
 
      <label class="control-label" translate> From ($) </label> 
 
      
 
      <input type="number" class="form-control" ng-model="obj.lowValue" ng-change='handleChange($index,"low")'> 
 
    </div> 
 
    <div class="col-lg-3 "> 
 
     <label class="control-label" translate> To ($) </label> 
 
      <input type="number" class="form-control" ng-model="obj.highValue" ng-change='handleChange($index,"high")'> 
 
    </div> 
 
</div> 
 
    </div> 
 
    </div>

来源

2015-10-14 05:59:19

Thnqq ..这是不是我所期望的，但它工作正常。 :) – JayKay

它听起来像你需要有1个变量个低值两个第n高的值和第（n + 1）。

所以这可能是你的模型：

$scope.values = [firstLowValue, secondLowValues ...]; 
$scope.lastHighValue = lastHighValue;

，并在您的模板：

<div ng-repeat="value in values"> 
     <div class="col-lg-3 "> 
       <label class="control-label" translate> From ($) </label> 
       <input type="number" class="form-control" ng-model="values[$index]" > 
     </div> 
     <div class="col-lg-3 " ng-if="!$last"> 
       <label class="control-label" translate> To ($) </label> 
       <input type="number" class="form-control" ng-model="values[$index + 1]" > 
     </div> 
<div class="col-lg-3 " ng-if="$last"> 
       <label class="control-label" translate> To ($) </label> 
       <input type="number" class="form-control" ng-model="lastHighValue" > 
     </div> 
    </div>

来源

2015-10-14 06:06:13

您能给我们ngChange做到这一点，请尝试：

<div ng-repeat="categoryObject in category.tiers track by $index"> 
     <div class="col-lg-3 "> 
       <label class="control-label" translate> From ($) </label> 
       <input type="number" class="form-control" ng-model="categoryObject.lowValue" > 
     </div> 
     <div class="col-lg-3 " ng-if="!$last"> 
       <label class="control-label" translate> To ($) </label> 
       <input type="number" class="form-control" ng-model="categoryObject.highValue" ng-change="categoryObject.lowValue[$index+1]=categoryObject.highValue[$index]"> 
     </div> 
      <div class="col-lg-3 " ng-if="$last"> 
       <label class="control-label" translate> To ($) </label> 
       <input type="number" class="form-control" ng-model="categoryObject.highValue"> 
     </div> 
    </div>

来源

2015-10-14 06:17:55

Angular JS：在ng-repeat中绑定两个文本文件

回答

相关问题