JpDevs JpDevs - 11 months ago 80
HTML Question

Angular JS dynamic HTML from PHP ng-click not working

I am new in Angular JS,

I want to make a ng-click event in dynamically made HTML from PHP, here is the code.

var app = angular.module('pageapp',[]);

.filter('to_trusted', ['$sce', function($sce){
return function(text) {
return $sce.trustAsHtml(text);

$scope.products =;
$scope.paginationLinks = response.links;

$scope.getPageData = function () {


<section ng-controller="productList">
<table class="table table-responsive table-hover">
<tr ng-repeat="product in products">
<td>{{$index + 1}}</td>
<ul class="pagination pull-right" ng-bind-html="paginationLinks|to_trusted""></ul>


public function Products(){
$start = 0;
$perPage = 10;
$count = DB::table('products')->count();
$totalPages = ceil($count/$perPage);
$data = DB::table('products')

for ($i=1; $i <= $totalPages; $i++) {
if($i == 1)
$links ="<li><a href=''>".$i."</a></li>";
$links .="<li><a href='' ng-click='getPageData(".$i.")'>".$i."</a></li>";

return [
'totalpages' =>$totalPages,
'data' =>$data,
'links' =>$links

Answer Source

Instead of adding ng-click='getPageData(".$i.") in PHP, add ng-click="getPageData($event)" to your ul element in your HTML. Hence you can get the clicked li element (by event bubbling) in your JS and you can do whatever you want.

hope it helps :)