2016-02-02 6 views
5

मैं अपने AngularJS अनुप्रयोग में jQuery datepicker उपयोग करने के लिए कोशिश कर रहा हूँ: "लेखन त्रुटि element.datePicker कार्य नहीं है", लेकिन मैं निम्न त्रुटि संदेश मिलता है:jQuery datepicker:

jQuery datepicker with AngularJS: "TypeError: element.datePicker is not a function" 

मैं इस जवाब से कोड का उपयोग: http://jsfiddle.net/kevinj/TAeNF/2/

यह पूरा कोड मैं का उपयोग कर रहा है: jQuery ui datepicker with Angularjs

यहाँ है कि एक ही जवाब से एक काम बेला है

<html> 
<head> 
    <script src="/js/angular.min.js"></script> 
    <script src="/lib/jquery/jquery-1.12.0.min.js"></script> 
    <script src="/lib/jquery/jquery-ui-1.11.4.min.js"></script> 
    <link rel="stylesheet" type="text/css" href="/lib/jquery/jquery-ui-1.11.4.min.css"> 
</head> 

<body ng-app="app"> 

<script> 
var datePicker = angular.module('app', []); 

datePicker.directive('jqdatepicker', function() { 
    return { 
     restrict: 'A', 
     require: 'ngModel', 
     link: function (scope, element, attrs, ngModelCtrl) { 
      element.datePicker({ 
       dateFormat: 'DD, d MM, yy', 
       onSelect: function (date) { 
        scope.date = date; 
        scope.$apply(); 
       } 
      }); 
     } 
    }; 
}); 
</script> 

<p><input type="text" ng-model="date" jqdatepicker></p> 
<p>{{ date }}</p> 

</body> 
</html> 

मैं पृथ्वी पर क्या गलत कर रहा हूं? धन्यवाद!

उत्तर

4

जब आप jQuery से पहले AngularJS लोड करते हैं, तो डिफ़ॉल्ट रूप से jQLite का उपयोग करेगा जो छोटे jQuery एपीआई है जो कोणीय के अंदर ही होता है।

मूल रूप से आपको डीओएम पूछताछ करते समय डिफ़ॉल्ट रूप से jQuery एपीआई का उपयोग करने के लिए कोणीय जेएस से पहले jQuery को शामिल करने की आवश्यकता है।

नहीं तो आप स्पष्ट रूप से उपयोग करने के लिए $(element)

NOTE

Make sure both the jQuery library version should be same, jQuery & jQuery.ui both.

Demo Fiddle

+0

आपकी प्रतिक्रिया पंकज के लिए धन्यवाद की जरूरत है, लेकिन दुर्भाग्य से यह अभी भी एक ही है। बस मामले में, मैं ऑनलाइन पुस्तकालयों में बदल गया, लेकिन कोई बदलाव नहीं। ये वे पुस्तकालय हैं जिनका मैं उपयोग कर रहा हूं: http://code.jquery.com/jquery-1.12.0.min.js http://code.jquery.com/ui/1.11.4/jquery-ui.min .js http://codeorigin.jquery.com/ui/1.10.3/themes/redmond/jquery-ui.css https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular .min.js –

+0

@MarcusEdensky अद्यतन उत्तर की जांच करें। यह भी सुनिश्चित करें कि लाइब्रेरी संस्करण समान होना चाहिए .. और नवीनतम कोणीय स्थिर संस्करण का उपयोग करें जो '1.4.8' –

+0

एक बार फिर पंकज धन्यवाद, लेकिन यह अभी भी काम नहीं करता है। मैंने कोणीय 1.4.9 (स्पष्ट रूप से स्थिर) में अपग्रेड किया और jQuery और jQuery UI दोनों के 1.12.0 का उपयोग किया। क्या तुम्हारे पास कोई विचार है? –