如何从ngRepeat中的文本输入中获取项目编号?

时间:2016-12-25 20:44:31

标签: javascript angularjs

我的HTML

<body ng-app="myApp" ng-controller="myCTRL">
  <form class="my-form" ng-repeat="item in items" novalidate>
    <h4>{{item.number}}</h4>
    <input type="text" ng-model="item.hed"><br>
    <input type="text" ng-model="item.subhed">
  </form>
</body>

我的JS:

var app=    angular.module("myApp",[]);
app.controller("myCTRL",function($scope,$http){
  $scope.items= [
    {
      number: chartNumber,
      hed: '',
      subhed: ''
    }
  ];
});

当我在input标记中输入内容时,我希望console.log() item.number值。如何使用AngularJS v1.6.1进行此操作?

3 个答案:

答案 0 :(得分:1)

希望这会有所帮助:

您的观点:

<input type="text" ng-model="item.hed" ng-keyup="$parent.inputHandler(item)">

你的控制器:

app.controller("myCTRL",function($scope,$http){
    $scope.items= [
    {
       number: chartNumber,
       hed: '',
       subhed: ''
    }
    ];

    $scope.inputHandler = function(item){
        console.log(item.number);
     }

});

答案 1 :(得分:1)

使用ng-change指令检测输入值的任何变化

   <body ng-app="myApp" ng-controller="myCTRL">
      <form class="my-form" ng-repeat="item in items" novalidate>
        <h4>{{item.number}}</h4>
        <input type="text" ng-model="item.hed" ng-change="inputChange(item)"><br>
        <input type="text" ng-model="item.subhed" ng-change="inputChange(item)">
      </form>
    </body>

JS

var app=    angular.module("myApp",[]);
app.controller("myCTRL",function($scope,$http){
  $scope.items= [
    {
      number: chartNumber,
      hed: '',
      subhed: ''
    }
  ];
  $scope.inputChange = function(item) {
     console.log(item.number);
  }
});

答案 2 :(得分:1)

&#13;
&#13;
angular.module("myApp",[])
.controller("myCTRL",function($scope){
  $scope.items= [
    {
      number: 1,
      hed: '',
      subhed: ''
    },
    {
      number: 2,
      hed: '',
      subhed: ''
    }
  ];
  $scope.log = function(num) {
    console.log(num);
  }
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCTRL">
  <form class="my-form" ng-repeat="item in items" novalidate>
    <h4>{{item.number}}</h4>
    <input type="text" ng-model="item.hed", ng-keypress="log(item.number)"><br>
    <input type="text" ng-model="item.subhed", ng-keypress="log(item.number)">
  </form>
</div>
&#13;
&#13;
&#13;