4

同じ jstree が読み込まれているフィドルが 2 つあります。1 つは角度ディレクティブでラップされ、もう 1 つはそうではありません。私は角度が初めてです。angularバージョンの画像が表示されません。また、アニメーションは機能しません。jstree プラグインがありませんか、それともこの機能を追加するバインド関数を追加する必要がありますか?

ここにフィドルがあります：（Angular jsではありません）

簡単な js ツリー コードは次のとおりです。

   $('#tree').jstree({
'plugins' : ['themes', 'json_data', 'checkbox', 'types'],
  'icon':false,
'checkbox' : {
  'two_state' : true // Nessesary to disable default checking childrens
},
 "json_data" : {
                        "data" : [
    {
        "data" : "Basics",
        "state" : "open",
        "children" : [{
            "data" : "login",
            "state" : "closed",
            "children" : [ "login", {"data" : "results", "state" : "open"} ]
        },


            {
                "data" : "Basics",
                "state" : "closed",
                "children" : [ "login", "something",{"data" : "results", "state" : "closed"} ]
            }
        ]
    },
    {
        "data" : "All",
        "state" : "closed",
        "children" : [ {
            "data" : "AddCustomer",
            "state" : "closed",
            "children" : [ "login","Add", {"data" : "results", "state" : "closed"} ]
        }    ]
    }
]
                    },
"types" : {
  "types": {
    "disabled" : { // Defining new type 'disabled'
      "check_node" : false, 
      "uncheck_node" : false 
    }, 
    "default" : { // Override default functionality
      "check_node" : function (node) {
        $(node).children('ul').children('li').children('a').children('.jstree-checkbox').click();
        return true;
      },
      "uncheck_node" : function (node) {
        $(node).children('ul').children('li').children('a').children('.jstree-checkbox').click();
        return true;
      }
    } 
  }
}

});

http://jsfiddle.net/R3vZv/

これは angular ディレクティブを使用したプランカーです。

http://plnkr.co/edit/xHIc4J

4

2 に答える 2

1

現在の AngularJS プロジェクトでは、jsTree をディレクティブに統合しています。それはかなり順調に始まりましたが、非常に速く悪夢になりました。遭遇した問題の半分を思い出すことはできませんが、痛ましいことに、バグの多い複雑なコードが大量に発生することになりました。ツリー ディレクティブをゼロから作成する方がよいでしょう。

ただし、以前に知っていればよかったプロジェクトに出くわしました:

https://github.com/tchatel/angular-treeRepeat

これはまさに私たちが必要としていたものであり、純粋な AngularJS であり (これは大きなメリットであり、登録する jQuery イベントはもうありません)、作成者は AngularJS コミュニティで有名で尊敬されている人物です (私のアプリの構築方法は彼と彼のおかげです)。ブログが多い）。

一般に、既存の jQuery ベースのライブラリを Angular ディレクティブでラップすることはお勧めできません。この特定のケースでは特にそうです。苦労を省いて、純粋な Angular に行きましょう。

于 2014-02-22T21:23:00.673 に答える