javascript - Semantic UI Popup not working inside angularjs directive -
just got problem, using semantic-ui show popup, not work if write code inside template reside in ng-view directive, work if write outside ng-view directive, wrong code?
this works
<body> <div class="ui container"> <div ng-view></div> <div class="ui teal button" data-title="using click events" data-content="clicked popups close if click away, not if click inside popup">click me</div> </div> <script> $('.ui.teal.button').popup({ on: 'click' }); </script> </body> this not work
<!-- index.html --> <body> <div class="ui container"> <div ng-view></div> </div> </body> <!--sample.html --> <div class="ui teal button" data-title="using click events" data-content="clicked popups close if click away, not if click inside popup">click me</div> <script> $('.ui.teal.button').popup({ on: 'click' }); </script>
when face situation have use directive , @ same time use semantic ui jquery initialization, have initalize sematic ui objects within directive.
so first thing have is, add button within ng-view directive. make new directive "showpopup".
<body> <div class="ui container"> <div ng-view showpopup> <div class="ui teal button" data-title="using click events" data-content="clicked popups close if click away, not if click inside popup">click me</div> </div> </div> <script> </script> this directive have add module.
thenameofyourmodule.directive( 'showpopup', function(){ return{ restrict: 'a', link: function(scope, elem, attrs) { $('.ui.teal.button').popup({ on: 'click' }); } }});
Comments
Post a Comment