jQuery에서 Modal 구성 요소를 빌드했습니다.
jQuery를 사용하지 않는 Angular 응용 프로그램에이 응용 프로그램을 통합하려고합니다. 외부 종속성으로 만 사용하고 싶지는 않습니다. 즉, 컨트롤러에서 호출 할 수있는 것으로 남겨 둘 필요가 없지만 지시문이나 서비스는 아닙니다.각도로 Modal 구성 요소를 작성하는 올바른 방법
내가 그것을 그냥 & 식으로 지시를해야하는 경우 좋은 생각이 각도 서비스 (factory, service, provider) 내부 DOM 로직이 있거나하는 것입니다 경우 약 혼란 스러워요? 아니면 둘 다?
컨트롤러 내부에서 Modal을 삽입하고 모달을 표시하거나 숨기고 메소드를 호출하여 내용을 설정하고 싶습니다.
이 작업을 수행하는 올바른 방법은 무엇입니까?
코드를 찾는 것이 아니라 "적절한 각도로"구현하는 방법에 대한 안내입니다.
감사합니다.
각도 서비스에서 dom 논리에 대한 질문에 대답하십시오. 아니요, 좋은 생각이 아니며, 정말로 생각해 보면 그럴 필요가 없습니다. 당신은 무엇을해야합니까 :
를 yes를 클릭 여부에 따라 콜백을 실행하거나 취소 할 수 있습니다 열림/닫힘 수
$modal 서비스를 사용하고 동일하게 보이도록 스타일을 직접 지정할 수 있습니다. 이 plunkr에서 살펴 보자 : 당신은 옵션 this을 참조 할 수 있습니다
$modal.open({
templateUrl: 'someTemplateOfTheModal',
controller: SomeControllerOfTheModal,
})
:로
이http://plnkr.co/edit/WLJfs8axxMJ419N2osBY?p=preview
그것은 간단합니다.
그렇지 않은 경우, 기존의 jquery 물건을 각도로 통합하는 방법에 대해서만 이야기하고 있다면 각도 방식으로 처음부터 다시 작성하는 것이 좋습니다. 기본적으로 모든 jquery 트리거/이벤트 기능을 순수 각도로 대체하십시오.
예를 들어, 모달은 켜기 또는 끌 수 있으며, 오버레이를 가질 수도 있고 가지지 않을 수도 있습니다. 모달 자체는 아마도 취소시가 아닌 예에서 콜백 이벤트를 실행하는 데 사용됩니다. 사용자 정의 클래스를 사용하여 스타일을 지정하여이를 고려해야 할 수도 있습니다.여기 지침은 당신이 처음부터 다시 작성하는 경우를 살펴 싶어 수 있습니다
조금 복잡해 질 수 있으므로 각도의 $ 모달 서비스를 사용하는 것이 가장 좋습니다. 모든 모달 기능이 내장되어 있기 때문입니다. 나는 그것이 모달로부터 당신이 원할지도 모르는 모든 것을 가지고 있다고 생각합니다, 그리고 여러분은 그것의 스타일을 정돈해야합니다. 물론 학습을 위해 바퀴를 재발 명하고 싶을 수도 있습니다.
$ 모달 서비스와 조심해서, 그것은 부트 스트랩 3과 잘 맞지 않습니다. – NicolasMoise
철저한 게시물, 바바 주셔서 감사합니다. 저는 $-modal 구현을 위해 Angular의 일부가 아닌 Angular-Ui를 사용하고 싶지 않습니다. 직접 수행하고이를 수행하는 방법을 이해하고 싶습니다. 나에게 분명하지 않은 점은 DOM 리스너가 서비스에서 지시문을 표시하고 숨길 수 있음이 분명합니다. 그러나 컨트롤러에서 show 메서드 나 changeModalTitle 또는 changeModalContent 메서드를 호출 할 때 지시문은 어떻게 알 수 있습니까? – Francisc
제목 속성에 대한 양방향 범위 바인딩 ('=')을 가질 수 있습니다. 그렇다면 함수를 호출 할 필요조차 없습니다. 당신은 할 수 있습니다 : modal.title = 'someTitle'; 당신의 각도가 당신의 모델을 업데이트 할 것입니다. 게다가, @ NicolasMoise는 이미 $ modal과 bootstrap 3을 오랫동안 성공적으로 사용했습니다. 왜 그런 말을 할 지 확신하지 못합니다. –
이 정보는 도움이 될 것입니다. http://robots.thoughtbot.com/animating-modals-in-angular-js/ – TheSharpieOne
감사합니다. CoffeeScript가 내 눈을 아프게하지만 고맙습니다. :) – Francisc