解决方案

Question

我可以计算单个输入的日期，但是当有更多输入时，我该怎么做？一个setfield有一个名字，DOB和AGE，AGE必须根据选择的DOB来计算... thig是用户可以使用相同的＆＃34;输入添加更多的setfield＆＃34;

<form>
<div ng-controller="datas">
 <div ng-repeat="data">
  <input name="text" name="names[{{$index}}][name]">
  <input class="form-control" 
       name="dobs[{{$index}}][dob]"
       type="text"
       id="dobs[{{$index}}][dob]">
  <input name="ages[{{$index}}][age] type="text">
 </div>
</div>
</form>

我使用angular来重复那个输入块包住用户需要更多......但问题是，如何计算年龄？...如果只有1个ID那么没问题，现在如果我使用类，并且用户添加6个块，则该类将是相同的，并且即使日期不同，该块（年龄）中的每个输入也将获得相同的年龄...

谢谢。

Answer 1

解决方案

我做了一系列假设，因为你的问题没有足够的信息。请根据您的需求量身定制。在这个例子中，我创建了一个包含名称和dob的对象数组。由于我们会计算age，因此我使用了html5字段output。

基本上，您需要做的是创建一个计算年龄的函数。由于您要存储dob，因此无需存储age。年龄应该是基于dob的计算字段。由于UTC时间是1970年，因此年龄的计算应为(today - dob).getFullYear() - 1970。见下文。

这可以避免您遇到的多个id问题。使用AngularJS，您应该始终首先考虑数据。操纵DOM应该是最后的手段。我怀疑你是根据id来计算年龄的。

这是jsFiddle。

代码

这是我的AngularJS模板：

<div ng-app="app" ng-controller="ctrl">
    <div ng-repeat="person in data">
        <input type="text" ng-model="person.name" />
        <input type="date" ng-model="person.dob" />
        <input type="output" value="{{ getAge(person.dob) }}" />
    </div>
</div>

这是我的Controller，以及辅助函数。

var app = angular.module('app', []);

var ctrl = function($scope) {
    /* Replace data with your resource/service call */
    $scope.data = [
        {name: 'Fred',
         dob: randDate()},
        {name: 'Bob',
         dob: randDate()},
        {name: 'Julie',
         dob: randDate()}
        ];

    /* Calculates the age */
    $scope.getAge = function(dob) {
        var now = new Date();
        var age = dateDiff(now, new Date(dob));
        return age.getFullYear() - 1970;
    };
};

function dateDiff(date1, date2) {
    return new Date(Math.abs(date1.getTime() - date2.getTime()));
}

/* Creates a random date in ISO format */
function randDate(){
    var now = new Date();
    var date = new Date(Math.random() * 
                    Date.UTC(now.getFullYear(), 
                             now.getMonth(),
                             now.getDate()));
    return date.toISOString().substring(0, 10);
}

使用datepicker计算多个输入的年龄

1 个答案:

解决方案

代码