2017-12-15 9 views
0

これは年齢を計算するコードです。複数の入力に対して同じメソッドを使用しています。ng-changeです。
しかし、私は単一のメソッドを使用して1つの入力フィールドだけの年齢をバインドすることができます。
なぜモデル名に基づいて複数の入力に対して結果データをバインドするために単一のメソッドを使用しないのですか?複数の入力フィールドから年齢を計算する単一のメソッドを使用する

var app = angular.module('myApp', []) 
 
app.controller('myController', function($scope) { 
 
    
 
    $scope.calculateAge = function (fieldName,value) {debugger 
 
     var birthDay =value; 
 
     var DOB = new Date(birthDay); 
 
     var today = new Date(); 
 
     var age = today.getTime() - DOB.getTime(); 
 
     age = Math.floor(age/(1000 * 60 * 60 * 24 * 365.25)); 
 
     
 
     fieldName=age; 
 
     //$scope.data1.age=age; 
 
    } 
 
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="myController" ng-init="init()"> 
 
<div> 
 
    <input type="date" ng-model="data1.dob" ng-change="calculateAge(data1.age,data1.dob)"/> 
 
    <input type="text" ng-model="data1.age"/> 
 
</div> 
 
<div> 
 
    <input type="date" ng-model="data2.dob" ng-change="calculateAge(data2.age,data2.dob)"/> 
 
    <input type="text" ng-model="data2.age"/> 
 
    </div> 
 
    
 
</div>

Iは、入力IDを渡すことによって行うために私ができる知っています。モデル名のために試しています。

答えて

1

あなたはこの方法であなたのdataの参照を渡して、それを変更する必要があります。

var app = angular.module('myApp', []) 
 
app.controller('myController', function($scope) { 
 
    
 
    $scope.calculateAge = function (data) {debugger 
 
     var birthDay = data.dob; 
 
     var DOB = new Date(birthDay); 
 
     var today = new Date(); 
 
     var age = today.getTime() - DOB.getTime(); 
 
     age = Math.floor(age/(1000 * 60 * 60 * 24 * 365.25)); 
 
     data.age = age; 
 
    } 
 
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="myController" ng-init="init()"> 
 
<div> 
 
    <input type="date" ng-model="data1.dob" ng-change="calculateAge(data1)"/> 
 
    <input type="text" ng-model="data1.age"/> 
 
</div> 
 
<div> 
 
    <input type="date" ng-model="data2.dob" ng-change="calculateAge(data2)"/> 
 
    <input type="text" ng-model="data2.age"/> 
 
    </div> 
 
    
 
</div>

1

ちょうどこれを試してください:$scope[fieldName] =age;

var app = angular.module('myApp', []) 
app.controller('myController', function($scope) { 

    $scope.calculateAge = function (fieldName,value) {debugger 
     var birthDay =value; 
     var DOB = new Date(birthDay); 
     var today = new Date(); 
     var age = today.getTime() - DOB.getTime(); 
     age = Math.floor(age/(1000 * 60 * 60 * 24 * 365.25)); 

     //fieldName=age; 
     $scope[fieldName] =age;// $scope[value] is eq. to $scope.data2.age 
    } 
}) 
関連する問題