Edit Question - KnowledgeHub

Title Body

New to Angular, just trying to get some harmony with Zurb Foundation 4. A case in point; I am trying to make use of the http://foundation.zurb.com/docs/components/reveal.html component. Straight-forward approach seemed to be to wrap as directives: directive('modal', function() { return { template: '<div ng-transclude id="notice" class="reveal-modal">' + '<a close-modal></a>' + '</div>', restrict: 'E', transclude: true, replace: true, scope: { 'done': '@', }, transclude: true, link: function(SCOPE, element, attrs, ctrl) { SCOPE.$watch('done', function (a) { // close-modal }); } } }). directive('closeModal', function() { return { template: '<a ng-transclude href="#" class="close-reveal-modal">x</a>', restrict: 'A', transclude: true, replace: true } }). directive('showModal', function() { return { template: '<a ng-transclude class="reveal-link" data-reveal-id="notice" href="#"></a>', restrict: 'A', transclude: true, replace: true, } }); This works fine up to a point, for example, I can use the modal to show different notices from a template: <modal done=""> <div ng-include src="'partials/notices/' + notice + '.html'"></div> </modal> <select ng-model="notice" ng-options="n for n in ['notice-1', 'notice-2']"> <option value="">(blank)</option> </select> <a show-modal>show modal</a> However, where it gets sticky is if I want to trigger close-modal/ show-modal from a controller/ on a certain event (e.g. within $watch ). I'm assumin

Tags (comma-separated) Cancel