了jQuery角获得输入字段值

Question

目前我有这个jQuery

$('body').on('click','.plot', function(){ 
     var y = $('input[name="gps[]"]').map(function() {return this.value;}).get(); 
     console.log(y); 
     console.log(y[0]); 
    }); 

我已经试过以下角度

theApp.controller('MenuSideController', ['$scope', function($scope) { 
    $scope.addnewmarker = function() { 
     var newdiv = document.createElement('div'); 
     newdiv.innerHTML = "<input type='text' name='gps[]' placeholder='Enter Address or Lat/Lon'>"; 
     document.getElementById('marker').appendChild(newdiv); 
     counter++; 
    }; 
    $scope.plotmarkers = function() { 
     var y = document.getElementsByName('gps[]').map(function() { 
      return this.value; 
      }).get(); 
     } 
     console.log(y); 
    }; 
}]); 

HTML

<div id="marker"> 
     <input type="text" name="gps[]" id="gps"> 
     <input type="text" name="gps[]"> 
    </div>       
<input type="button" value="Add another marker input" ng-click="addnewmarker();"></br> 

<button class="plot btn" ng-click="plotmarkers()">Plot</button> 

我想通过使用ng-click和I c来改变一个小的流程以在Angular中工作annot似乎得到这个工作，有人可以帮我吗？

注：输入获得动态添加的，所以我可以永远不知道有多少投入会有，我试图做到这一点的角度，而不是jQuery的

Answer 1

不要基于jQuery想，总以为在建筑术语。在jQuery中，您设计了一个页面，然后使其成为动态页面。这意味着你可以使用jQuery直接修改DOM。但在角js创建您的自定义指令修改DOM。

为了动态添加文本字段，我创建了一个控制器，如下所示。

app.controller('MainCtrl', function($scope) { 
    $scope.inputFields = []; 
    $scope.count = 0; 
    $scope.addField = function(){ 
    $scope.inputFields.push({name:"inputText"+$scope.count++}); 
    } 
}); 

有一个名为addField（）的函数。在div或按钮等元素的单击事件中调用此函数。检查下面的html代码。

<div ng-click="addField()">Click here to add</div> 
<div ng-repeat="inputField in inputFields"> 
    <input type="text" name="inputField.name"> 
</div> 

您必须阅读这篇文章：How do i think in Angular if i have a jQuery background 。 检查以下链接以了解添加表单域的想法。

1. Create Html Elements dynamically
2. Adding multiple input field
3. Rendering form html dynamically