Angularjs指令删除从父分区的所有内容 [英] Angularjs directive removes all content from parent div
问题描述
我有自定义指令申报与替换的设置的真正的
当我把它放在HTML配有独立的结束标记:
< DIV>
<搜索框搜索=搜索(查询)查询=查询>< /搜索框>
< DIV CLASS =dataDiv>
<! - 其他div元素 - >
< / DIV>
< / DIV>
一切正常。
但这种方式重写后的HTML:
< DIV>
<搜索框搜索=搜索(查询)查询=查询/>
< DIV CLASS =dataDiv>
<! - 其他div元素 - >
< / DIV>
< / DIV>
指令完全取代所有父DIV的内容与它的模板,并会删除的 dataDiv 的距离产生的HTML页面。
是可以在指令声明中改变了这种预期的角度行为还是什么?
指令:
功能搜索盒(){
返回{
限制:'E',
更换:真实,
模板:'...',
范围: {
查询:'='
},
链接:功能($范围,$元素){
...
},
控制器:函数($范围){
...
}
}
}
根据您的文档类型,你可能给错意的关闭斜线。
默认情况下,自耕农发电机和角度种子使用<!DOCTYPE HTML>
(HTML5)
在HTML 5,<富/>
办法<富>
。斜杠只是语法糖
勾选此是自结束标记有效的HTML5?
根据浏览器的实现,它会自动在一个地方或其他添加结束标记,当你离开体
或强就像
打开并阅读呈现code。
I have custom directive declaration with replace set to true.
When I place it in html with separate close tag:
<div>
<search-box search="search(query)" query="query" ></search-box>
<div class="dataDiv">
<!--other div elements -->
</div>
</div>
everything works as expected.
But after rewriting html in this way:
<div>
<search-box search="search(query)" query="query" />
<div class="dataDiv">
<!--other div elements -->
</div>
</div>
directive completely replaces all parent div content with it's template and removes dataDiv from resulting html page.
Is this expected angular behavior or something that can be changed in directive declaration?
Directive:
function SearchBox() {
return {
restrict: 'E',
replace: true,
template: '...',
scope: {
query: '='
},
link: function($scope, $element){
...
},
controller: function ($scope) {
...
}
}
}
Depending on your doctype you might be giving the wrong meaning to the "closing" slash.
by default, yeoman generator and angular-seed use <!doctype html>
(html5)
In HTML 5, <foo />
means <foo>
. The slash is just syntactic sugar
Check this Are self-closing tags valid in HTML5?
Depending on the browser implementation, it will add automatically a closing tag in one place or another, just like when you leave body
or strong
open and read the rendered code.
这篇关于Angularjs指令删除从父分区的所有内容的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!