Angular.js: 自己終了タグ付きのカスタムディレクティブは、タグの兄弟をキャプチャします

作成日 2013年02月05日  ·  12コメント  ·  ソース: angular/angular.js

テンプレートで自動終了タグとともに使用されるタイプ要素のディレクティブを使用する場合、ディレクティブが処理されるときに、タグに続く兄弟が削除されます。
例えば

'foo'という名前のディレクティブがあり、テンプレートは

<div>
  <foo />
  <span>Sibling</span>
</div>

最終結果から兄弟を削除します。

MacのChrome24.0.1312.57とSafari6.0.2(8536.26.17)の両方でこれが発生します

回避策: <foo /><foo></foo>置き換えます

最も参考になるコメント

html仕様で定義されている自己終了要素またはvoid要素は、ブラウザーパーサーにとって非常に特別です。 独自に作成することはできないため、カスタム要素の場合は、void以外の要素( <foo></foo> )に固執する必要があります。

これは角度を変えることはできません。 閉鎖。

全てのコメント12件

html仕様で定義されている自己終了要素またはvoid要素は、ブラウザーパーサーにとって非常に特別です。 独自に作成することはできないため、カスタム要素の場合は、void以外の要素( <foo></foo> )に固執する必要があります。

これは角度を変えることはできません。 閉鎖。

これも私をつまずかせた。 ドキュメントに何かを追加できますか? Angularサイトで「自己終了タグ」を検索しても何も表示されませんが、Googleが私をここに連れてきました。

残念ながら、自動終了タグを使用したディレクティブはありません。ブラウザのHTMLパーサーがタグを無効タグとして許可するかどうかを決定するため、これらをサポートすることは実際には不可能です。 :(

これはドキュメントに記載されていると思いますが、記載されていない場合は、メモしてパッチを送信してください。

たぶん私は正しいドキュメントを使用していませんか? 「自己閉鎖」を検索することは何の操作もなし(「結果なし」なども何も言わない)であり、「ディレクティブ」を検索すると大量の結果が得られますが、リンクに「ディレクティブ」という単語が含まれているものはありません。 。 そのため、そのパッチがどこに行くのかわかりません。

カスタムの「自己閉鎖」要素またはvoid要素を使用する場合は、ドキュメントをXHTMLとして配信できますが、XHTMLでAngularJSを使用しようとしたことはありません。

:+1: @chbrown :ディレクティブのドキュメントでこれに言及するための提案。
:+1: @ Lenne231 :興味深い観察のために:AngularJSはXHTMLで機能しますか?

:+1:@ Lenne231 :興味深い観察のために:AngularJSはXHTMLで機能しますか?

少なくともその一部はXHTMLで機能しますが、どれだけかは明らかではありません。

IEで<textarea>を自己閉鎖する必要があるシナリオに出くわしました。

これは問題ではありませんか、それとも回避策がありますか? 将来の参考のために、Powers-that-beはStackOverflowでその質問への回答を追加しますか?

@IgorMinar 、私はあなたの仕様の読み方と解釈に同意しVOIDELEMENTの仕様です。 それが「ブラウザにとって非常に特別」であるとは言いません。 それは「いかなる状況でもコンテンツがない」可能性があると言っています。 その場合、Angularチームはそれが標準であると宣言し、議論を終了する可能性があります。 Angularがブラウザの種類を超えてDOMVOID要素を適切に処理できない可能性もあります(ただし、あなたは言いません)。

しかし、私はこれらのどれも水を保持するとは思わない。 この動作を修正しない理由はありません。 正しい修正は(表示され、現在動作すると角度は、すでにあちこちDOMを操作)スタート&フィニッシュタグで空の要素を交換することになり、その後、仲間をつかむか、そうでない場合はそれらを一掃しない(つまり、バグを修正) 。 それ以外の場合は、回避策であるHTMLコードを作成する必要があります。

<speaker-control ng-model="volume"/><speaker-control ng-model="volume"></speaker-control>よりもはるかに好ましい

まあ。 これを再検討するか、ディレクティブを処理するAngularソースコードへのポインターを投稿してください。 たぶん、ここの誰かが、将来の包含のために修正を提出するための時間、エネルギー、そしてチョップを持っているでしょう。

誰かがこれが起こるのを見たいと思うなら、そして/または簡単なテストケースのために、これは

OK、私はこれを修正しました。 これがこのトピックに関するjsFiddleを作成しました。 これは、現在すべてのブラウザに伝播されている元のブラウザでの初期の誤った実装だったと思います。 これはめったに使用されないタグ構文であり、ほとんどの人はvoid要素がどのように機能するかを理解していません。 XML(およびその前のSGML)は、これらすべてを何年も前に設定しました。 これは、タグセマンティクスが機能することになっている方法ではありません。 正直なところ、すべてのブラウザの動作を修正する必要があります。 どういうわけか、フロントエンドMVCフレームワークの小さなサイドケースがブラウザーのWWW変更をトリガーするのではないかと思います。 修正する場合は、HTMLの次のW3Cリビジョンに移行する必要があると思います。 誰もがトーチを取りたいと思いますか?

ここで考えてみてください。 多分それは愚かです。 しかし、自動閉鎖<br />角度ディレクティブを追加することは機能しますか?

@ bjorn-ali-goransson、動作するはずですが、これがこのスレッドにどのように関連しているかわかりません。

このページは役に立ちましたか?
0 / 5 - 0 評価