0

現在、angular-drag-and-drop-listsを使用して JsonDTO オブジェクトを生成しています。JSON からのグラフィカル表現の生成は正常に機能します。また、さまざまな要素をドラッグ アンド ドロップして JSON を生成することもできます。私は主にネストされたリストのチュートリアルを使用して、初期リストをセットアップし、新しい要素をドラッグするためのボタンをセットアップしました。ただし、これは、dnd-type を li-elements に、dnd-allowed-type を ul-elements に追加しようとするまでしか機能しません。その「エディター」で作成したいJsonには、サブ要素の特定の階層構造があるため、これらのタイプを使用することが要件です。

私がそれをどのように実装したかを以下のコードスニペットで見つけてください。さらに情報が必要な場合はお知らせください。誰かがこの問題で私を助けてくれれば本当に感謝しています

何かを挿入したいリスト：

<div class="form-group label-floating">
    <label class="control-label" for="name">Name</label>
    <input class="form-control" type="text" class="form-control" id="name"  ng-model="models.questionnaire.name">
</div>
<ul dnd-list="models.questionnaire.pages"
    dnd-allowed-types="models.allowedTypes.questionnaire">
    <li ng-repeat="page in models.questionnaire.pages"
        dnd-draggable="page"
        dnd-type="page.type"
        dnd-effect-allowed="move"
        dnd-moved="models.questionnaire.pages.splice($index, 1)"
        dnd-selected="models.selected = page"
        ng-class="{'selected': models.selected === page}"
        ng-include="'page.html'">
    </li>
</ul>

新しいページをドラッグするためのボタン:

<li dnd-draggable="{title: 'title', dndType: 'page', sections: []}"
            dnd-effect-allowed="copy">
            <button type="button" class="btn btn-default btn-lg" disabled="disabled">Page</button>
        </li>
4

1 に答える 1

0

誰かが同じ質問をしている場合、それがページをドラッグするためのボタンの私の解決策です:

<li dnd-draggable="{title: 'title', sections: []}"
            dnd-effect-allowed="copy"
            dnd-type="'page'">
            <button type="button" class="btn btn-default btn-lg" disabled="disabled">Page</button>

        </li>

私の場合、見たサンプルコードでは使用されていなかったため、dnd-type を設定するのを忘れていました。

于 2016-10-27T08:55:32.743 に答える