2014-03-01 32 views
0

我只是将这个日期选择器用于角度。问题是,风格/ css丢失:jquery UI日期选择器缺少样式/ css

myApp.directive('calendar', function() { 
      return { 
       require: 'ngModel', 
       link: function (scope, el, attr, ngModel) { 
        $(el).datepicker({ 
         dateFormat: 'yy-mm-dd', 
         onSelect: function (dateText) { 
          scope.$apply(function() { 
           ngModel.$setViewValue(dateText); 
          }); 
         } 
        }); 
       } 
      }; 
     }) 

有谁知道如何修复风格?看起来像jQuery的用户界面或其他什么? 的jsfiddle: http://jsfiddle.net/dingen2010/a6WDH/1/

+0

JqueryUi需要一个用于UI的Css。确保你已经添加了它。 – 2014-03-01 06:48:19

回答

0

入住这JsFiddle 你只需要添加Ui.css 在external recourse选项卡上的jsfiddle的LEFü不得不添加外部用户界面的css

<!doctype html> 
<html lang="en"> 
<head> 
<meta charset="utf-8"> 
<title>jQuery UI Datepicker - Default functionality</title> 

<link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css"> 

<script src="//code.jquery.com/jquery-1.9.1.js"></script> 
<script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script> 
<link rel="stylesheet" href="/resources/demos/style.css"> 
<script> 
$(function() { 
$("#datepicker").datepicker(); 
}); 
</script> 
</head> 
<body> 
<p>Date: <input type="text" id="datepicker"></p> 
</body> 
</html> 
0

在你的页面添加到jQuery的ui.css参考