我想建立一个基于布尔标志添加和删除第二个指令的指令。
因此,当boolFlag = true时,example.html中的div应重新编译以包含my-dir作为属性。并且它应该具有my-dir以“test = 1”形式所需的其他属性。
以下是我到目前为止的基本知识:
example.html ----
<div add-remove when={{boolFlag}} dir-name="my-dir" dir-attrs="test, 1"></div>
add-remove-directive.js ----
function($compile, $timeout) {
return {
restrict: 'A',
link: function(scope, elem, attrs) {
var attrArray = attrs.dirAttrs.split(',');
for (a in attrArray) {
attrArray[a] = attrArray[a].trim();
}
attrs.$observe('when', function() {
// flagged when the directive should be attached to the element
var isWhen = attrs.when === 'true';
if (isWhen) {
for (a = 0; a < attrArray.length; a+=2) {
elem.attr(attrArray[a], attrArray[a+1]);
}
newScope = scope.$new();
cElem = $compile(elem)(newScope);
elem.replaceWith(cElem);
$timeout(function() {
scope.$destroy();
});
}
// if the flag is not set, remove the dynamic directive from the element
// but only if the element already has the given directive
else {
normDirName = attrs.$normalize(attrs.dirName);
console.log(normDirName);
console.log(r, 'elsed', attrs);
if (!attrs.hasOwnProperty(normDirName)) return;
elem.removeAttr(scope.dirName);
for (a = 0; a < attrArray.length; a+=2) {
elem.removeAttr(attrArray[a]);
}
newScope = scope.$new();
cElem = $compile(elem)(newScope);
elem.replaceWith(cElem);
$timeout(function() {
scope.$destroy();
});
}
}
}
--- --- EDIT
抱歉,我从项目中复制它是一个错误。它的功能取决于我在原帖中的描述。
基本上现在的情况是我可以使用相应的必需属性“test = 1”正确地动态“my-dir”指令。
但我遇到的问题是:
有两个范围是原始的,没有“my-dir”,另一个范围是“my-dir”。
当boolFlag设置为false时,我的else语句无法从div中正确删除“my-dir”。