親要素内から複数の入力フィールドの値を取得するAngularJS

Question

これまでに尋ねられたことがありましたが、次のHTMLが動的に生成されています（ユーザーがボタンをクリックすると、ページに追加）、これらのエントリはすべてコンテナdiv内にあります。

<div class="entry"><tr><td><input type="text" name="firstname"/></td>' + 
     '<td><input type="text" name="surname" /></td></tr></div> 

ユーザーが送信すると、各エントリ内の両方の入力からデータを取得できます。

誰でもこれを行う方法に関する提案はありますか？

ありがとうございました！

Answer 1

この指令では、ng-modelとng-submitを使用することをお勧めします。

<script> 
    angular.module('MyApp', []).directive('myDirective', function() { 
     return { 
      template: '<form ng-submit="submit()">' + 
        '<div class="entry">' + 
         '<tr>' + 
          '<td><input type="text" ng-model="firstname" /></td>' + 
          '<td><input type="text" ng-model="surname" /></td>' + 
          '<td><input type="submit" value="Submit" /></td>' + 
         '</tr>' + 
        '</div>' + 
       '</form>', 
      link: function (scope, element) { 
       scope.submit = function() { 
        console.log("scope.firstname", scope.firstname); 
        console.log("scope.surname", scope.surname); 
       }; 
      } 
     }; 
    }); 
</script> 
<div ng-app="MyApp"> 
    <div my-directive></div> 
</div> 

次に、firstnameとsurnameを付けて送信機能で他の操作を行うことができます。