2013-01-17 6 views
6

आशा किसी और को भी इस मनाया: -AngularJS डाटा क्रोम दिनांक समय नियंत्रण से बाध्यकारी अद्यतन करने के बाद काम नहीं कर रहा 24.0.1312.52

हम तत्व Chrome की अच्छा डिफ़ॉल्ट datetime पिकर पाने के लिए के साथ प्रयोग कर type = "तारीख" AngularJS 1.0 का उपयोग कर रहे हैं और । सबकुछ ठीक काम कर रहा था जब तक क्रोम हाल ही में अपडेट नहीं हुआ [24.0.1312.52]। अब यदि मैं डेटाटाइम पिकर का उपयोग कर दिनांक बदलता हूं, तो AngularJS डेटा बाध्यकारी इसे $ स्कोप की जेसन संपत्ति को बाध्य करने के लिए सहेजता नहीं है।

यदि मैं किसी कुंजीपटल कुंजी के माध्यम से दिनांक बदलता हूं, तो डेटा बाध्यकारी संपत्ति को बांधने की तिथि बचाता है।

इस समस्या का कारण क्या हो सकता है।

उत्तर

2

हम AngularJS गूगल समूह में मदद मिली: -

https://groups.google.com/forum/?fromgroups=#!topic/angular/ycYzD3xRKS8

JSFeedle पीटर द्वारा बेकन डार्विन

http://jsfiddle.net/ZsRxj/

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

module.directive('input', function() { 
    return { 
    require: '?ngModel', 
    restrict: 'E', 
    link: function (scope, element, attrs, ngModel) { 
     if (attrs.type="date" && ngModel) { 
     element.bind('change', function() { 
      scope.$apply(function() { 
      ngModel.$setViewValue(element.val()); 
      }); 
     }); 
     } 
    } 
    }; 
}); 
0

ऐसा लगता है कि जब आप पिकर के माध्यम से कोई दिनांक चुनते हैं तो क्रोम input नहीं आग लगता है। एक शॉर्ट-टर्म हैक change ईवेंट (जो क्रोम आग) input पर अग्रेषित करना है; क्यों क्रोम input फायरिंग नहीं है

$('body').on('change', 'input[type="date"]', null, function(){ 
    $(this).trigger('input'); 
}); 

एक बेहतर समाधान होगा यह पता लगाने की: सौभाग्य से AngularJS, श्रोता में घटना अपने आप में उपयोग नहीं करता है तो आप मानचित्रण घटना मान या कुछ के बारे में चिंता करने की जरूरत नहीं है ।

चेतावनी: थोड़ी देर वहाँ AngularJS कोड कि change आग (जिससे अनंत लूप शुरू) का कारण होता है में कहीं भी हो प्रतीत नहीं होता है, और सरसरी परीक्षण ऊपर काम करता है, "बेहतर समाधान" निहित होगा बहुत बेहतर समाधान।

4

मैं एक ही व्यवहार देखा और पाया है कि है Sutikshan सही रास्ते पर था।

एचटीएमएल 5 input date मूल्य की आवश्यकता है RF 3339 प्रारूप में होना है, इसलिए, हम स्वरूपित और उसके अनुसार यह मान पार्स करने हमारे AngularJS input directive समायोजित कर सकते हैं।

angular.module('myApp', []).directive('input', ['$filter', 
function($filter) { 
    return { 
     require: '?ngModel', 
     restrict: 'E', 
     link: function(scope, element, attrs, ngModel) { 
      if (!ngModel || attrs.type != "date") return; 

      // Using AngularJS built in date filter, convert our date to RFC 3339 
      ngModel.$formatters = [function(value) { 
       return value && angular.isDate(value) 
        ? $filter('date')(value, 'yyyy-MM-dd') 
        : ''; 
      }]; 

      // Convert the string value to Date object. 
      ngModel.$parsers = [function(value) { 
       return value && angular.isString(value) 
        ? new Date(value) 
        : null; 
      }]; 
     } 
    }; 
}]); 

मूल बातें हम यह सुनिश्चित करता है कि NgModelController हमारे $ formatters उपयोग करता है और $ पारसर्स जब दृश्य मान और मॉडल मूल्य को अद्यतन करने, क्रमशः है।

संबंधित मुद्दे