3

私のチームは、jquery mobile と angular.js の両方を使用してモバイル アプリケーションを作成しようとしています。少しトリッキーなようです。jquery mobile を使用して動的アコーディオンを構築しようとしていますが、angular js による ng-repeat ディレクティブを使用しています。

    <div data-role="collapsible" ng-repeat="catalog in catalog_list | filter: isDependent"> 

         <h6>
             {{ catalog.catalog_name }} <span ng-show="catalog.next"> <a  ng-click="changeCurrent(catalog.catalog_id)"> {{ catalog.next }}</a></span>

        </h6> 
            <p>some Content</p>


</div>
 </div>

jquery mobile はハッシュタグと URL を使用してアコーディオンを機能させるため、Angular は URL の変更を解釈してページ ビューのリロードを引き起こします。いくつかの jquery モバイル機能を無効にしようとしました。

    $.mobile.hashListeningEnabled = false;
    $.mobile.linkBindingEnabled = false;
$.mobile.ajaxEnabled = false;

これはアコーディオンでは機能しないようです。以前のルーティングの問題は解決しました。jqm と angular を一緒に使用するためのアダプターがあることを確認しましたが、サードパーティのソフトウェアに依存する必要は避けたいと考えています。アダプターなしでAngular jsとjqmを一緒に使用するかどうかについての意見もいただければ幸いです。また、モバイル サイトで 1 つだけを使用することを選択する必要がある場合、どれをお勧めしますか? また、その理由は何ですか?

お手伝いありがとう！

4

2 に答える 2

1

折りたたみ可能なng-repeatアイテムを div コンテナー内にラップする

<div id="mylist">
<div data-role="collapsible" ng-repeat="catalog in catalog_list | filter: isDependent"> 
    <h6>
       {{ catalog.catalog_name }} 
       <span ng-show="catalog.next"> 
           <a  ng-click="changeCurrent(catalog.catalog_id)"> {{ catalog.next }}</a>
       </span>
    </h6> 
    <p>some Content</p>
</div>
</div>

ページが読み込まれ、angular が ng-repeat を適用した後のスクリプトで、$("#mylist").trigger("create");を指定してみてください。

于 2014-05-22T09:55:01.057 に答える