長い試行の後、私は解決策を得て、それがうまく動作しているようです。必要なacitreeインクルードファイルを含めて、ここで私はangitにacitreeを含めるよう指示しました。
.directive('aciTree', function($compile) {
return {
restrict: 'A',
scope: {
content: '='
},
link: function (scope, element) {
scope.$watch('content', function() {
scope.checkTreeEvent = function(event, api, item, eventName, options) {
var id = api.getId(item);
switch (eventName) {
case 'checked':
break;
case 'unchecked':
break;
}
}
if (scope.content) {
element.aciTree(scope.content).bind('acitree', scope.checkTreeEvent);
}
});
}
};
})
は、HTMLページに次のコードを含ま:次のようにツリーの
<div id="tree" ng-show="!errorMsg" aci-tree content="options" class="aciTree" style="height:265px;overflow:auto;"></div>
JSONは、コントローラに含めることができます。
var data = [{
"id":101,
"label":"Total Vehicle Range",
"inode":true,
"checkbox":false,
"radio":false,
"branch":[{
"id":102,
"label":"75 miles",
"inode":false,
"checkbox":false,
"radio":true
},
{
"id":103,
"label":"300 miles",
"inode":false,
"checkbox":false,
"radio":true
},
{
"id":104,
"label":"500 miles",
"inode":false,
"checkbox":false,
"radio":true
},
{
"id":105,
"label":"700 miles",
"inode":false,
"checkbox":false,
"radio":true
}]
}];
scope.options = {
rootData: data,
checkbox: true
};
希望を、これが誰かを助け!!!!
私の推測が正しいかどうか教えてください。http://acoderinsights.ro/source/aciTree/aciTree-radio.htmlのラッパーとして動作するカスタムのangularjs指示文を作成したいのですか? –
あなたはこのように多くの質問のためにSOを検索することができます。 jQueryコンポーネントを角度アプリにブレンドすると、首に痛みがあります。できればそれを避けてください。通常、ネイティブな角度の同様のコンポーネントを見つけることができます。あなたができないのであれば、SOを検索して答えをまとめることができます。 – jbrown
@jbrownが正しいです。しかし、実際にプラグインのラッパーディレクティブが必要な場合は、インターネットに多くのリソースがあります。 https://bencentra.com/code/2015/09/29/jquery-plugins-angular-directives.html –