0

タグ付け可能な要素を構築し、TagsInput を利用する AngularJS のディレクティブに取り組んでいます

これが機能するフィドルです：http://jsfiddle.net/mgLss/

理由はわかりませんが、そのディレクティブをアプリケーションに追加すると、IT は正常に動作しますが、その下で実行中の angular は失敗し、次のエラー メッセージが表示されます。

Error: node is undefined
compositeLinkFn@http://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.js:3837
compositeLinkFn@http://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.js:3837
nodeLinkFn@http://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.js:4216
compositeLinkFn@http://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.js:3834
compositeLinkFn@http://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.js:3837
compositeLinkFn@http://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.js:3837
compositeLinkFn@http://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.js:3837
nodeLinkFn@http://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.js:4216
compositeLinkFn@http://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.js:3834
compositeLinkFn@http://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.js:3837
compile/<@http://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.js:3746
bootstrap/</<@http://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.js:932
Scope.$eval@http://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.js:7808
Scope.$apply@http://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.js:7888
bootstrap/<@http://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.js:930
invoke@http://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.js:2788
bootstrap@http://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.js:929
angularInit@http://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.js:904
@http://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.js:14397
f.Callbacks/o@http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js:2
f.Callbacks/p.fireWith@http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js:2
.ready@http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js:2
B@http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js:2

最後の 1 時間を IRC で過ごしましたが、私の質問に対する確認応答が得られませんでした。これまで何度も行われてきたように、Stack が助けになってくれることを願っています。

4

2 に答える 2

1

これは、使用しているプラ​​グインに関連するものであり、Angular が気に入らない方法で dom を操作します。正直に言うと、ソース コードを調べて問題の根本を指摘することはしませんでした。しかし、これを修正する方法 (醜い方法) があります。

<div ng:controller="TestCtrl">
    {{ hello }}
    <div><taggable default="changed"></taggable></div>
</div>
​

そのディレクティブを別の DOM 要素内にラップするだけで、プラグインが分離されていることを確認できます。

http://jsfiddle.net/mgLss/33/

于 2013-01-04T16:47:42.170 に答える
0

@fastreload の回答に基づいて、HTML を変更する必要のない、やや醜いソリューションを構築します。

// as per @fastreload, wrap input in a div to prevent Angular from getting confused
template: "<div><input type=\"text\"></div>",
link: function(scope, elm, attrs) {
    elm.children().tagsInput({      // note children()

また、フィドル (リソースの管理の下) (および一般的なコード) に Angular を最後に含める必要があります。これelmは、ラップされた Angular 要素ではなく、ラップされた jQuery 要素であるため$(elm)、リンクで使用する必要はありません。関数。

于 2013-01-04T17:05:01.053 に答える