Wrapping Foundation 4 각도로 표시

Question

각도를 처음 사용하면 Zurb Foundation 4와 조화를 이루려고 노력합니다. 나는 http://foundation.zurb.com/docs/components/reveal.html 구성 요소를 사용하려고합니다.

:이 시점까지 잘 작동

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, 
    } 
}); 

, 예를 들어, 내가 템플릿에서 다른 고지 사항을 표시하도록 모달를 사용할 수 있습니다

스트레이트 포워드 방식은 지시로 포장 될 듯

그러나 끈적 거리는 곳은 콘트롤러/특정 이벤트 (예 : $watch)에서 가까운 모달/쇼 모달을 트리거하고 싶습니다. 내 지시문에 클릭을 발생시키는 컨트롤러가 필요하다고 가정하고 있지만 각도 동작이 좋을까요?

Answer 1

컨트롤러는 UI 이벤트를 직접 트리거하거나 UI 요소를 직접 조작해서는 안됩니다. 모든 코드는 Directives에 포함되어 있습니다.

당신이 할 수있는 것은 :

1. 바인드 부모 범위에 지침 범위에서 부울 및 그에 시계를 추가합니다. 이미 그렇게했다고 생각합니다. 또는
2. 컨트롤러에서 $ broadcast를 실행하고 범위를 추가하십시오. 다음 명령을 닫을 때 $ watch를 사용하십시오.

Answer 2

이 질문은 매우 오래된 질문이며 Reveal과 작동하는지 잘 모르겠습니다. 그러나 나는 단지 각도의 .RUN() 메소드에 .foundation() 메서드를 호출하여 각도에 보관 용 라이브러리를 포장 한 : 나를 위해 작동

app.run(function ($rootScope) { 
    $rootScope.$on('$viewContentLoaded', function() { 
     $(document).foundation(); 
    }); 
}); 

합니다. 사용자 상호 작용을 처리하기위한 지시문을 작성할 수도 있습니다.