have been working on a project where using angular js Html content has to
be appended to a div but the ng-click doesn't work using this approach. I
have googled up a lot of things. Also tried using*$compile* before
appending the Html to the div but sadly no luck.
Please take a look at the code below and let me know if there is anything
that can help.
<div id="tileLayout" style="width: 198px; height: 173px;"
ng-controller="TileController" ng-init="init(1000,@ViewBag.Index, 'UTILTS')"
ng-click="openTab('UTILTS.TABVIEW.TABTITLE',param = { id:@ViewBag.Index,
status:'', titleStatic: '@ViewBag.Direction' })"><div style="height:
35px;"><span class="text-left"><img
src="@Url.Content("~/Images/Icons/utilts_icon.png")" alt="" style="width: 35px;
height: 35px;"></span><span
class="text-center"> {{data.title}}</span></div><div>
<div style="padding-top: 3px; padding-bottom: 3px;"><span class="text-left"
style="font-size: 10px;">{{(data.title1 | translate) || "N/A"}}</span><span
class="pull-right" style="font-size:
10px;">{{data.loaded}}/{{data.loadedTotal}}</span></div>
<input type="hidden" ng-model="data.param1" />
<div id="progressbar1" kendo-progress-bar="progressBar"
class="progressBar" style="font-size: 10px;" k-min="0" k-max="100"
ng-click="openTab('UTILTS.TABVIEW.TABTITLE', param = {id:@ViewBag.Index,
status:data.param1})" stop-click-event></div></div><div>
The app.js consist of the code for appending html code to the div
var elem = $("<div id=\"tileInstance_" + tileId + "\" class=\"item w2 h2\"
ng-click=\"alert('moi')\">" +
"<div class=\"dashboard_tile\" style=\"height:
25px;\">" +
"<div>" +
"<div class=\"dashboard_tile
title\">{{'TILE.COMPANY_SELECTION' | translate}}</div>" +
"<div style=\"float:right; display:inline-block;\"
class='ui-icon ui-icon-closethick ui-removable-tile'
popover=\"{{'TILE.REMOVE_TOOLTIP' | translate}}\"
popover-trigger=\"mouseenter\" popover-placement=\"top\"></div>" +
"<div style=\"float:right; display:inline-block;\"
class='ui-icon ui-icon-gear ui-configurable-tile' ng-click=\"openConfig(id = "
+ tileId + ", '" + tiledata.prefix + "')\" popover=\"{{'TILE.CONFIGURE_TOOLTIP'
| translate}}\" popover-trigger=\"mouseenter\"
popover-placement=\"top\"></div>" +
"</div>" +
"</div>" +
"<div>" +
data +
"</div>" +
"</div>");
//console.log("Packery container: " +
$rootScope.container['tab-' + tiledata.tabId]);
var $items = $compile(elem)($scope);
$rootScope.container['tab-' +
tiledata.tabId].append($items);
$rootScope.container['tab-' +
tiledata.tabId].packery('appended', $items);
//service.InitializeTiles(tiledata.tabId);
$rootScope.container['tab-' + tiledata.tabId].packery();
service.InitializeTiles(tiledata.tabId);
service.InitializeTabs(tiledata.tabId);
I have used container to append the html code to packery. The div does get
appended to the container/div but the ng-click does not work. I have also
tried using normal $("#id").append($items) but no luck with it either.
--
You received this message because you are subscribed to the Google Groups
"AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
