0

ここで奇妙なことが起こっています。

次のディレクティブを取得しました。 

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

私はそれをこのコードに追加しています： 

<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>

上記のようにオーバーレイ「datenschutz」を開きます (ng-show="datenschutz")。トグルはうまく機能しますが....

ページが表示された後に div を直接開くと、スクローラーが読み込まれて正常に表示されます。できます。
しかし、ほんの数秒待ってから「datenschutz」オーバーレイを開くと、スクローラーはロードされず、まったくロードされません。

私は 2 番目のオーバーレイに似たようなものを持っていますが、これも起こります。

編集/更新:
問題は、jQueryが非表示の要素にスクリプトを適用できないことであることがわかりました。ng-repeat (div 内) の $last 要素が読み込まれる前に div をすばやく開くと、div が表示されるため機能します。

誰かがその回避策を知っていますか?

4

1 に答える 1

1

解決策 1 (クイック アンド ダーティ):
AngularUI を「ui-toggle」ディレクティブに使用しました。ui-hide または ui-show をクラスとして要素に切り替えます。
その後、このCSSを使用しました： 

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

Chrome 24 と Firefox 18 で動作しました。

誰かが他の解決策を見つけた場合は、投稿してください。私の解決策はおそらく最善の解決策ではありません。

于 2013-01-15T18:56:03.137 に答える