-
Notifications
You must be signed in to change notification settings - Fork 3.5k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Correct way of using $.material.init() with AngularjS #191
Comments
have you tried including arrive.js before material.js ? |
Hmm.. I'm not sure what you mean by using arrive.js, I didn't saw it in any of your examples neither I know what that script does. Here is my list of scripts <script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="js/plugins.js"></script>
<script src="//tinymce.cachefly.net/4.1/tinymce.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-rc.5/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-rc.5/angular-resource.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-rc.5/angular-route.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-rc.5/angular-cookies.min.js"></script>
<script src="bower_components/angular-local-storage/dist/angular-local-storage.min.js"></script>
<script src="js/vendor/angular_tinymce.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<script data-require="ui-bootstrap@0.11.0" data-semver="0.11.0" src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.11.0.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-material-design/0.1.5/js/ripples.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-material-design/0.1.5/js/material.min.js"></script>
<script src="//fezvrasta.github.io/snackbarjs/dist/snackbar.min.js"></script>
<script src="js/main.js"></script>
<script src="js/services.js"></script>
<script src="js/controllers/main_controller.js"></script>
<script src="js/controllers/authentication_controller.js"></script>
<script src="js/controllers/account_controller.js"></script>
<script src="js/controllers/map_controller.js"></script>
<script src="js/controllers/new_user_controller.js"></script>
<script src="js/controllers/pages_controller.js"></script>
<script src="js/controllers/new_page_controller.js"></script>
<script src="js/controllers.js"></script>
<script src="js/directives.js"></script> I've tried rearranging them in many different orders but nothing seems to fix my problem :( I will search for arrive.js and Include it before material.js and see what happens. Thank you for this awesome library and for the quick response! :) |
That actually fixed the problem! Thank you!! :) |
you're welcome :) |
Hi FezVrasta, First of all i would say that great talent is revealed in this work :) I'm trying to use your lib in AngularJS App. Is it something familiar or I'm doing something wrong? Thanks again for this gem! |
looks like arrive.js make things lag a lot. You can manually init new elements (this is the suggested way) using |
Thanks for the quick response. Doing $.material.input() (in case of input) ruin Angular.js data binding. |
This theme does not make use of web components |
What do you mean? Can you a bit elaborate on that? Thanks! |
@chenop did you find some way around to use this in angular? |
Use Arrive.js with the PR #365. This is the easiest way. It has not performance issues anymore and works great. |
I'm having trouble running $.material.init() in my Angular app. Receiving the following error:
I have merged in the patch from PR#365 and included arrive.js, and here's how I'm attempting to init the plugin (via an ng-init tag in my ng template):
Any ideas? |
This is also not working for me too. Could you please share an example of doing it correctly? |
arrive.js worked for me Thanks
|
If you are trying to use this project with AngularJS try http://tilwinjoy.github.io/angular-bootstrap-material/ |
hi, I have read all comments here, and I have tried including arrive.js to fix it, but I doesn't work. |
@christopher-ustb did you read the comment just above yours? Maybe give it a try... |
Hi,
I've been having troubles using $.material.init() inside my controllers in AngularJS. Specially with the form-control tag.
My problem is if I don't call $.material.init() inside a controller the ripple effects/floating label does not work. And if I call it the ripples works just fine but the data binding by ng-model doesn't. I've been able to work around it by manually getting the element using an id once the form is submitted but I need to implement it to a search bar on which needs the data binding by the ng-model.
Is there a correct way of instantiating the $.material.init() that would make it available to all my controllers?
Thanks!
The text was updated successfully, but these errors were encountered: