Angular爲許多元素動態添加ng-click

我有一個帶有許多矩形的SVG對象的離子應用程序（例如<rect class="info" id="1001" width="20" height="20" transform="translate(40,40)" />）。我希望爲每個指令添加一個ng-click指令，而不需要手動將ng-click添加到它們中的每個指令。Angular爲許多元素動態添加ng-click

目前，相反，我在控制器下面的代碼：

$(document).ready(function() { 
    $('#svg').on('click', 'rect.info', dispInfo); 
}

這工作需要，但似乎並沒有成爲「角」的方式。有沒有更好的方法來做到這一點？

我已經試過這似乎更加棱角分明下面，但不得要領：

var elems = $('#svg rect.info'); 
elems.attr('ng-click', 'dispInfo()'); 
$compile(elems);

這成功地增加了NG-點擊指令到適當的元素，但他們不火。我打電話給$compile的方式會不會有問題？

來源

2016-06-08 Vasseurth

爲了更有角度的方式，爲什麼不能用你的svg矩形包裝指令，並添加ng-click作爲指令模板的一部分？

我在代碼中看到的問題是，$ compile函數接受html模板。你可以試試下面，

var elems = $('#svg rect.info'), 
    $parent = elems.parent(); 

elems.attr('ng-click', 'dispInfo()'); 
elems = $compile(elems.html())($scope); // pass your scope variable instead of $scope 
$parent.empty().append(elems);

來源

2016-06-08 15:42:19

嗯，這好像和以前一樣 - 沒效果。當我扔'console.log（elems.html（））'這是空字符串 – Vasseurth

我已經更新了我的答案，但我不確定爲什麼elems.html（）不返回任何內容。如果你可以重現這是在jsFiddle，分享它進一步檢查。 –

Angular爲許多元素動態添加ng-click

回答

相關問題