MDB and angularjs


Topic: MDB and angularjs

thorarinnhauksson pro asked 9 years ago

Hi I am having troubles getting MDB pro to work in angularjs. I am using <div ui-view></div> so my HTML is in a partial html and I have also tried ng-include and same issue ex I could not get panel (popout) to work inside a "ng-include" or ui-view. Am I missing something ?

Michal Szymanski staff pro premium priority answered 9 years ago

Hi, I am afraid it's more angular thing than MDB. I can try to help you but I suppose you would get more help on stackoverflow or any angular help. Do other MDB components work fine within your project?

thorarinnhauksson pro answered 9 years ago

Hi Yes I am also having trouble with sidenav. This is strange because I have used bootstrap in a similar way and no troubles there... I will try to google this some more, maybe this is a angular thing or just me doing something wrong :)

riderx pro answered 9 years ago

Hi thorarinnhauksson, i had the same problem, it's because my includes are not in the right order actually i have try MDB panel popout in my website and it's work with angular and ui-router, do you use a base made with yeoman ?

thorarinnhauksson pro answered 9 years ago

Hi riderx I tried this: <script src="MDBPro/js/jquery.min.js"></script> <script src="MDBPro/js/bootstrap.min.js"></script> <script src="MDBPro/js/mdb.js"></script> <script src="lib/angular/angular.min.js"></script> <script src="lib/angular-ui-router/release/angular-ui-router.min.js"></script> <script src="app.js"></script> But still f.ex popout does not work

thorarinnhauksson pro answered 9 years ago

Hi Got it to work I needed to include mdb.js in the partials as well Thanks for all your help

riderx pro answered 9 years ago

that's weird i don't need to put in my partial.

thorarinnhauksson pro answered 9 years ago

Hi guys I am still hvaing trouble getting mdbootstrap working with angular. And the double-navigation is not working in safari on ios... When I try the double-navigation in ios it takes all the screen and zooms... The double-navigation code (partials/menu.html ) is copied from the example and I have not modified it in any way in my index.html: ` <div ng-include src="'partials/menu.html'"></div> <div class="container ui-view-margin-top"> <div ui-view></div> </div> <script src="lib/jquery/dist/jquery.min.js"></script> <script src="MDBPro/js/mdb.js"></script> <script src="lib/bootstrap/dist/js/bootstrap.min.js"></script> <script src="lib/angular/angular.min.js"></script> <script src="lib/angular-ui-router/release/angular-ui-router.min.js"></script> <script src="app.js"></script>` My test is running on azure and IIS that should not have anything to do with this strange behavior ? Can anyone please help

Michal Szymanski staff pro premium priority answered 9 years ago

What version of Safari and what device do you use? Does it work with SideNav ? I'm afraid you need a support someone with knowledge about angular 1 and we are not experts about it.

riderx pro answered 9 years ago

Actually it's work for me with lasted ios and safari and chrome on iphone 6. do you have put this in your partial ? <script> // Initialize collapse button $(".button-collapse").sideNav(); // Initialize collapsible (uncomment the line below if you use the dropdown variation) $('.collapsible').collapsible(); </script> https://drive.google.com/file/d/0B65L8tQY-iIWeFJSWm5zRTVadzg/view?usp=sharing or in production : app.you2you.fr

santosh611 answered 8 years ago

styles are not worked in inside ui-view

Michal Szymanski staff pro premium priority answered 8 years ago

Any error message inside the console?
Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Specification of the issue
  • User: Pro
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No