カスタム タグを通常の HTML に置き換えるディレクティブがあります。削除したい属性がいくつかあります。たとえば、構文が与えられた場合
<ui mybutton width="30"></mybutton>
私のディレクティブはそれをに変換します
<div width="30" class="btn">bla bla </div>
"width=30"
それを削除して追加したいstyle="width:{{old width value here}}"
私はコンパイルとリンク機能を試してきました。コンパイルまたはリンク機能でそれを行う必要がありますか?
テンプレートに変更を加えたいので、コンパイル関数で行う必要があると思いました。
http://jsfiddle.net/WptGC/2/ で実際にご覧ください。警告: ブラウザがハングする可能性があります。 ライブで安全にご覧くださいhttp://jsfiddle.net/WptGC/3/すべてをクラッシュさせるコードがコメントされています。
.directive('mybutton', function($compile) {
return {
restrict: 'A',
//transclude: true,
template: '<div class="this is my subscreen div" style="width:{{width}}"></div>',
replace: false,
/*scope: {
width: '@',
height: '@',
x: '@',
y: '@'
},*/
compile: function($tElement, $tAttrs) {
console.log("subscreen template attrs:");
console.log($tAttrs);
var el = $tElement[0];
//el.getAttribute('width');
var stylewidth = el.getAttribute('width');
el.removeAttribute('width');
return function(scope) {
$compile(el)(scope);
}
}
}
})
奇妙なループが発生しています (console.log が数千回表示されます)。