2013-01-15 2 views
0

나는 여기에서 이상한 일이있어.Angularjs - Jquery 로딩

이 링크를 클릭에
<div ng-show="datenschutz" class="alldealermodal"> 
    <p ng-show="loading">Loading...</p> 
    <div> 
     <h1 class="headline">DATENSCHUTZ</h1> 
     <div class="closebtndiv"><a href="#" ng-click="datenschutz=false" class="closebutton">Close</a></div> 
     <div class="clear"></div> 
     <div class="nano" addscroller> 
     <div class="content"><p>BIG LONG TEXT</p></div> 
     </div> 
    </div> 
    <div class="fadeout"></div> 
</div> 

<p><a href="#" ng-click="datenschutz=!datenschutz" class="datenschutz">Datenschutz</a></p> 

는 오버레이를 엽니 다

app.directive('addscroller', function() { 
     return function (scope, elm, attrs) { 
       // jQuery Script triggern 
       // AngularJS: jQuery(selector) = element. 
        elm.ready(function() { 
         elm.nanoScroller({ alwaysVisible: true });  
        })  
     } 
    }); 

이 코드에 추가 해요 :

나는 다음 지시문을 얻었다 위의 "datenschutz"(ng-show = "datenschutz"). 토글은 훌륭하게 작동하지만 ....

페이지가 나타난 후 div를 직접 열면 스크롤러가로드되어 잘 보입니다. 그것은 작동합니다.
하지만 잠시 기다렸다가 몇 초 후에 "datenschutz"오버레이를 열면 스크롤러가로드되지 않고 전혀로드되지 않습니다.

두 번째 오버레이와 비슷한 점이 있습니다./UPDATE

편집 :
나는 문제가 jQuery를가 숨겨져 요소에 스크립트를 적용 할 수 있다는 것을, 알아 냈어. ng-repeat (div 안에 있음)의 $ last 요소가로드되기 전에 div를 빠르게 열면 div가 표시되기 때문에 작동합니다.

누구나 해결 방법을 알고 있습니까?

답변

1

해결책 1 (빠르고 더러운) :
"ui-toggle"지시문을 사용하여 AngularUI를 사용했습니다. ui-hide 또는 ui-show를 요소로 클래스로 토글합니다.
는 그 후이 CSS를 사용 : 사람이 다른 솔루션을 가지고있는 경우 크롬 24, 파이어 폭스 (18)

에 나를 위해 일한

.ui-show {opacity:1;visibility: visible;} 
.ui-hide {opacity:0;visibility: hidden;} 

을 게시하시기 바랍니다. 내 해결책은 아마도 최선의 해결책이 아닙니다.

+0

나는'display : none'과 비슷한 문제를 겪었고 그것을 가시로 설정하는 것이 내가 필요로하는 것을 얻을 수있는 유일한 방법이며 당신과 비슷한 지시어를 만들었다. 답변을 수락 된 것으로 표시하고 나중에 더 나은 대답이 나오면 나중에 변경하십시오. –