html - Conflict on ng-view while loading materialize javascript files -
i have following layout page:
<body scroll-spy="" class="theme-template-dark theme-amber alert-open alert-with-mat-grow-top-right solar-custom"> <main> <div class="main-container"> <div class="main-content" autoscroll="true" bs-affix-target="" init-ripples=""> <section class="forms-basic"> <div ng-view class="view-animate view-fade"> </div> </section> </div> </div> </main> </body>
i have ng-view here in order html files on code , place it's content inside here. problem noticed following: have various textboxes materialize should have animation kicks in on focus , blur.
however, noticed animation not occur on elements inside ng-view.
one thing noticed there function on js file runs when page loads.
$(function () { $('[data-toggle="tooltip"]').tooltip(), $('[data-toggle="popover"]').popover(), $(".navbar-toggle").sidenav({ menuwidth: 260, closeonclick: !0 } ); var = [".btn:not(.withoutripple)", ".card-image", ".navbar a:not(.withoutripple)", ".dropdown-menu a", ".nav-tabs a:not(.withoutripple)", ".withripple"].join(","); $("body").find(a).ripples(), $(".form-control").each(function () { $(this).val() && $(this).parent().addclass("filled"), $(this).bind("blur", function (a) { input = $(a.currenttarget), input.val() ? input.parent().addclass("filled") : input.parent().removeclass("filled"), input.parent().removeclass("active") } ).bind("focus", function (a) { input = $(a.currenttarget), input.parent().addclass("active") } ) } ) }
that code runs smoothly on load, , when click on textbox on main page (not in example). but, if add input on html used ng-view, not run, leads me believe when js file runs, ng-view not rendered yet.
so, there way can ng-views read of materialize properties , not have these kinds of issues?
Comments
Post a Comment