根据datalist值填充角度js中的文本字段

时间:2017-03-16 07:33:44

标签: javascript jquery html angularjs

我想根据数据列表计数填充文本框字段。如果count为3,我必须填充3本教科书。

<datalist id="testList">
    <option ng-repeat="des in DesList" value=" {{des.id}} ({{des.code}})" data-ng-change="addText(des.id)>
</datalist>

我尝试创建这样的脚本。但没有运气。

 this.addText = function(count) {

    this.arrayText.push(obj);

  }
}

1 个答案:

答案 0 :(得分:0)

尝试使用此Jsfiddle demo

此处更新了代码Jsfiddle link updated

Js代码

  var app = angular.module('myApp', []);
  app.controller('ctrl1', function($scope) {
    $scope.rules = [{
      name: 'rule1',
      id: 1
    }, {
      name: 'rule2',
      id: 2
    }];
    $scope.data = [];
    var dummy = [];

    $scope.addText = function(rule) {

      dummy.push(rule);
      if (dummy.length > 2) {
        $scope.data = angular.copy(dummy);
        $scope.one = $scope.data[0];
        $scope.two = $scope.data[1];
        $scope.three = $scope.data[2];
      }
    }
  });

HTML代码

  <div ng-app='myApp'>
    <div ng-controller='ctrl1'>
      <select ng-options='item.name as item.name for item in rules' ng-model='rule' ng-change='addText(rule)'>

      </select>
      <hr> Length: {{data.length}}
      <hr>
      <div ng-if='data.length > 2'>
        <input type='text' ng-model='one'>
        <input type='text' ng-model='two'>
        <input type='text' ng-model='three'>
      </div>
    </div>
  </div>

根据你的问题,我建立了这个,但你可以扩展这个