Angular Material: date picker, missing theme? - angularjs

I got some trouble integrating the Angular Material date picker in my application:
Looking at the diff between my local version and the demo version, I noticed that I don't have any <style md-theme-style> element in my head. What am I missing? :)
I added the ngMaterial dependency to my app, and included the ./node_modules/angular-material/angular-material.scss file through Webpack. Moreover, I didn't override the $mdThemingProvider configuration.
Any clue? :)

Add the latest release of angular-material.min.js to your project:
<script src="https://ajax.googleapis.com/ajax/libs/angular_material/1.0.0-rc1/angular-material.min.js"></script>
PS: I had the same issue you were having all day and after reading your question, I decided to also compare my project with the demo version, which brought me to the solution, so thank you!

It's bug in version 0.11.4 See here
It works fine in verion 0.11.3. See here
It also works fine in version 1.0.0-rc7 See here
Just choose a different version.

Related

Accordion component in AEM throwing error while building the project

Recently I was using the out of box accordion component in my AEM project (6.5). The component is working fine in author and publish mode. But when I'm trying to build the project using Maven, I'm getting the below error.
**${item.name in accordion.expandedItems}: extraneous input 'in' expecting {'}','.','&&','||','[','#'}**
There are no other detailed information regarding the error. What am I doing wrong here?
Thanks in advance.
You might reference an older version of HTL/Sightly in your pom.xml that has no support for in relational operator (which was added in version 1.4 of the spec).

Kendo angular directives

I am using Angular 1.5.* together with Kendo UI. I am following the documentation and have completed all the recommended steps found on the Telerik site:
Including the kendo scripts and styles
Adding kendo.directives to my angular module
Using the kendo-[directive] syntax in the markup
Everything renders fine, but when I try to interact with the widgets I am getting the following error:
Uncaught TypeError: f.getClientRects is not a function(…)
This is what my markup looks like:
<input kendo-date-picker ng-model="model.user.dob" />
The same error happens when I try to use a drop down list defined as:
<select kendo-drop-down-list k-data-source="model.languages" ng-model="model.user.language"></select>
I have used Kendo for years, but for the first time, I am using it together with Angular and feel a little lost :)
What am I missing? Any help would be greatly appreciated.
Thank you
I would make sure you have the kendo scripts in the right dependency order
<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="./bower_components/angular/angular.min.js"></script>
<script src="js/kendo.all.min.js"></script>
Another thing that might work for older versions of kendo, is trying the deprecated angular-kendo npm package
<script src="./bower_components/angular-kendo/angular-kendo.js"></script>
Or, it could be caused from the animations so try angular-animate npm package:
<script src="./bower_components/angular-animate/angular-animate.js"></script>
Another thing you might want to check is the date going into the Kendo DatePicker
$scope.model.user.dob = new Date('2016-06-01T04:00:00');
It turns out that the issue was in the kendo version I was using. Once I upgraded to the latest build, everything went back to normal.

Angular Material Calendar incompatibility?

I'm trying to use this cool little angular module:
https://angular-material-calendar.bradb.net/
When doing bower install I get:
Unable to find a suitable version for angular-material, please choose one by typing one of the numbers below:
1) angular-material#~0.11 which resolved to 0.11.4 and is required by material-calendar#0.2.14
2) angular-material#^1.0.9 which resolved to 1.0.9 and is required by public
It looks like this thing was developed in beta, and I can't get it to work with 1.0.9. Does anyone know any workarounds? This module is exactly what I'm looking for.
Thanks!
Use --force-latest or add component version to resoltions key in bower.json
Note
For more info you could check the issue here. I hope this helped.

Angular Material fabSpeedDial

Angular Material fabSpeedDial is not working in Andriod Mobile.
(Important Note:ISSUE OCCURS IN ANDRIOD MOBILE ONLY WHEN I USE, jquery-2.2.3.min.js)
I have a demo code taken from the following codepen link
Angular Material fabSpeedDial
If i remove that jquery-2.2.3.min.js, then the functionality works fine both in mobile and desktop.
But iam in a situation where i cannot remove this jquery-2.2.3.min.js. I also tried having lower version of jquery like 2.2.2 , 2.2.1 etc, but same results.
Please help me in finding a solution for this problem.
This issue is fixed after updating angular-material.js to v0.11.2

angular-ui-calendar error: 'calendar.fullCalendar is not a function'

this is in the directive.
Have been pounding my brains out for days on this
angular 1.4.7
angular-ui-calendar 1.0.1
fullcalendar 2.3.1 2.4.0 etc
jquery 2.1.4, 2.1.3, 2.1.1
any one else running into this??
You don't list moment.js as one of your dependent scripts, but it is required by full calendar.
I created a plunk just to try this out and I did indeed get the error, but you'll note right above the error you mentioned it complains about moment not being available.
You haven't given me much to go on, but since you didn't mention moment in your dependent scripts that's the best guess I can come up with. If you remove the comment tags that surround the moment.js script in index.html in the plunk I provided, it will render the calendar.
<!--
<script data-require="moment.js#2.10.2" data-semver="2.10.2" src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.2/moment.min.js"></script>
-->

Resources