UNPKG

jqwidgets-framework

Version:

jQWidgets is an advanced Angular, Vue, Blazor, React, Web Components, jquery, ASP .NET MVC, Custom Elements and HTML5 UI framework.

25 lines (24 loc) 1.58 kB
<!DOCTYPE html> <html ng-app="demoApp" lang="en"> <head> <meta name="keywords" content="AngularJS Calendar, Month Calendar, MonthCalendar, DateTimeInput, DateTimePicker, Date Picker" /> <meta name="description" content="AngularJS Calendar example. This example demonstrates a Calendar built with Angular JS. Week Numbers feature is demonstrated" /> <title id='Description'>The AngularJS Calendar can show the week of the year. To display the week of the year, you need set the showWeekNumbers property to true. By default, the jqxCalendar does not display the week of the year. </title> <link rel="stylesheet" href="../../../jqwidgets/styles/jqx.base.css" type="text/css" /> <script type="text/javascript" src="../../../scripts/jquery-1.11.1.min.js"></script> <script type="text/javascript" src="../../../scripts/angular.min.js"></script> <script type="text/javascript" src="../../../scripts/demos.js"></script> <script type="text/javascript" src="../../../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../../../jqwidgets/jqxangular.js"></script> <script type="text/javascript"> var demoApp = angular.module("demoApp", ["jqwidgets", "jqwidgets-amd"]); demoApp.controller("demoController", function ($scope) { $scope.calendarSettings = { rowHeaderWidth: 25, showWeekNumbers: true, width: 220, height: 220 }; }); </script> </head> <body ng-controller="demoController"> <jqx-calendar jqx-settings="calendarSettings"></jqx-calendar> </body> </html>