সমস্যা
Firefox (লেখা পর্যন্ত) <input type="date"> সাপোর্ট করে না। এটি সাধারণ টেক্সট বক্স হিসেবে আচরণ করে এবং মান স্ট্রিং আকারে ফেরত দেয়। AngularJS-র ngModel একটি Date অবজেক্ট আশা করে, স্ট্রিং নয়।
সমাধান: দ্বৈত বাইন্ডিং (Two-way Binding) সহ একটি ফিল্টার
একটি আসল Date অবজেক্ট (date) এবং একটি স্ট্রিং রিপ্রেজেন্টেশন (dateString) রক্ষা করুন, $watch দিয়ে সিঙ্ক করুন।
কন্ট্রোলার কোড
function MainCtrl($scope, dateFilter) {
$scope.date = new Date(); // আসল Date অবজেক্ট
// Date → String (yyyy-MM-dd) برای ইনপুট ভ্যালু
$scope.$watch('date', function (date) {
$scope.dateString = dateFilter(date, 'yyyy-MM-dd');
});
// String → Date (ইনপুট থেকে পরিবর্তন হলে)
$scope.$watch('dateString', function (realdate) {
$scope.date = new Date(realdate);
});
}
টেমপ্লেট
<input type="date" ng-model="dateString" />
নোট: Firefox এখন type="date" সাপোর্ট করে (v57+), কিন্তু পুরনো ভার্সন সাপোর্টের জন্য এই প্যাটার্নটি এখনও উপকারী।
