Я изучал с AngularJS в течение нескольких дней, и я думал о создании datepicker. Я задумался о нескольких вещах, которые еще не совсем понятны для меня. Во-первых, это код, который я написал для моего DatePicker:AngularJS: Render собственный модуль более одного раза
angular.module('datepicker', []).directive('myDatepicker', function() {
return {
scope: {
clickCallback: '&',
options: '='
},
restrict: 'E',
templateUrl: 'datepicker.php',
link: function($scope, $element, $attr) {
$scope.day = 0;
$scope.month = 0;
$scope.year = 0;
$scope.years = [];
$scope.days = [];
$scope.months = getStandardMonths();
$scope.init = function() {
for (var i = 1; i <= 31; i++)
$scope.days.push({
value: i,
text: (i < 10) ? "0" + i : i
});
$scope.days.unshift({
value: 0,
text: "--"
});
$scope.months.unshift({
value: 0,
text: "--"
});
var year = new Date().getFullYear();
var start = year + 3;
var end = year - 50;
for (var j = start; j >= end; j--) {
$scope.years.push({
value: j,
text: j
});
}
$scope.years.unshift({
value: 0,
text: "--"
});
}
$scope.update = function() {
var last = 32 - new Date($scope.year, $scope.month - 1, 32).getDate();
if ($scope.day > last) {
$scope.day = last;
}
last++;
if ($scope.days.length > last) {
var shrink = $scope.days.length - last;
$scope.days.splice(last, shrink);
} else {
for (var i = $scope.days.length; i < last; i++)
$scope.days.push({
value: i,
text: i
});
}
if ($attr.partial) {
$scope.dism = !($scope.year);
$scope.disd = !($scope.month);
if (!$scope.year) {
$scope.disd = true;
$scope.day = $scope.month = 0;
}
if (!$scope.month) {
$scope.day = 0;
}
}
}
$scope.disd = $scope.dism = ($attr.partial === undefined) ? false : $attr.partial;
$scope.init();
}
};
});
Это шаблон, я написал для того, чтобы сделать модуль Datepicker:
<select ng-model="day" ng-options="d.value as d.text for d in days" ng-visible="!disd"> </select>
<select ng-model="month" ng-options="m.value as m.text for m in months" ng-change="update()" ng-visible="!dism"></select>
<select ng-model="year" ng-options="y.value as y.text for y in years" ng-change="update()"></select>
И мое использование, которое является довольно неразветвленной вперед:
<my-datepicker partial="true" />
Теперь, когда я копирую строку выше в несколько раз, она по-прежнему оказывает единый контроль Datepicker (не несколько datepickers не показаны на странице HTML). Я не могу понять, почему, если бы кто-нибудь мог пролить свет здесь, я был бы очень благодарен.
У меня есть список разных предметов, все с его собственной датой. Следующим шагом было бы привязать дату в объекте списка к функции внутри этой даты.
Примечание: частичный атрибут позволяет пользователю не заполнять полную дату, а только год или год и месяц.