How to use angularjs ng-click function returning from a php html?

0

I have a mobile app and I have content to be listed through php using ng-bind-html what goes on and that within php in html I want to call a function of a controller that I have but does not work liked to know how I can solve and what is the best way to solve?

Return php code

$limite = "9";

$result_fotos = $conexao->prepare("SELECT * FROM estabelecimentos WHERE slug = :slug ");
$result_fotos->bindValue(':slug', $_GET['slug'], PDO::PARAM_STR);
$result_fotos->execute();
$row_fotos = $result_fotos->fetch(PDO::FETCH_OBJ);

$result_limite = $conexao->prepare("SELECT * FROM estabelecimentos_anexos WHERE id_mae = :id_mae AND seccao = :seccao ");
$result_limite->bindParam(':id_mae', $row_fotos->id, PDO::PARAM_INT);
$result_limite->bindValue(':seccao', 'fotos', PDO::PARAM_STR);
$result_limite->execute();
$row_limite = $result_limite->fetch(PDO::FETCH_ASSOC);

$result_anex_fotos = $conexao->prepare("SELECT * FROM estabelecimentos_anexos WHERE id_mae = :id_mae AND seccao = :seccao LIMIT 9");
$result_anex_fotos->bindParam(':id_mae', $row_fotos->id, PDO::PARAM_INT);
$result_anex_fotos->bindValue(':seccao', 'fotos', PDO::PARAM_STR);
$result_anex_fotos->execute();
$fotos_perfil = $result_anex_fotos->fetchAll(PDO::FETCH_OBJ);

$fotos_maior_valida = $result_limite->rowCount() - $result_anex_fotos->rowCount();

foreach ($fotos_perfil as $row_anex_fotos) {

      $fotos .= '

        <div style="margin:0px 0px 0px -5px;">
            <div style="margin-left:5px; float:left">
                <a href=""><img width="50" height="50" style"border-radius:10px;" src="https://www.sabeonde.pt/gtm/php/timthumb.php?src=gtm/anexos/fotos/'.$row_anex_fotos->id_anexo.'.'.$row_anex_fotos->tipo.'"alt="'.$row_anex_fotos->titulo.'&h=114&w=114&a=c" /></a>
            </div>
        </div>

  '; 
}

if($result_anex_fotos->rowCount() == 9 ){

    $fotos_maior = '

        <div style="float: left;" ng-click="fotos()" ng-controller="ModalFotos" class="caixa_limite">+'.$fotos_maior_valida.'</div>

    ';

}


$return = '

        <div class="card">
            <div class="item item-text-wrap">
                <h2 style="margin:0px 0px 10px 0px;">Fotos</h2>
                '.$fotos.'
                '.$fotos_maior.'
                <div style="float: left; margin:0px 0px 20px 5px;" class="caixa_limite"><i style="font-size: xx-large;" class="ion-camera"></i></div>
            </div>    
        </div>

';

echo json_encode($return);

Controller

.controller('VerFotosEstabelecimento', function($scope, $http, $stateParams) {
    $http.get("https://www.sabeonde.pt/api/api_ver_fotos_estabelecimento.php?slug="+$stateParams.EstabelecimentoSlug).success(function (data) {
        $scope.ver_fotos_estabelecimento = data;
    });
})

Controller Modal

 .controller('ModalFotos', function($scope, $ionicModal, $timeout) {

    // Create the login modal that we will use later
    $ionicModal.fromTemplateUrl('templates/fotos-modal.html', {
        scope: $scope
    }).then(function(modal) {
        $scope.modal = modal;
    });

    // Triggered in the login modal to close it
    $scope.closeLogin = function() {
        $scope.modal.hide();
    };

    // Open the login modal
    $scope.fotos = function() {
        $scope.modal.show();
        console.log(); 
    };

})
    
asked by anonymous 03.10.2015 / 19:09

1 answer

0

EDIT 1

You can do the following:

In the angle controller:

app.controller("AppController", function($scope) {
    $scope.olaMundo = function(msg){
        alert(msg);
    };
});

Calling in php:

echo "<script>" + 
        "var $scopeApp = angular.element('[ng-controller='AppController']').scope();" +
        "$scopeApp.olaMundo('Caba não mundão!!!');" +
     "</script>";

EDIT 2

Following your example. In php:

echo "<script>" + 
         "var $scopeApp = angular.element('[ng-controller='ModalFotos']').scope();" +
         "$scopeApp.fotos();" +
     "</script>";

EDIT 3

if($result_anex_fotos->rowCount() == 9 ){
    $fotos_maior = '
        <div style="float: left;" ng-click="fotos()" ng-controller="ModalFotos" class="caixa_limite">+'.$fotos_maior_valida.'</div>
        <script> 
             var $scopeApp = angular.element("[ng-controller=' + "'"  + ModalFotos + "'"  + ']").scope();
             $scopeApp.fotos();
         </script>;
    ';
}
    
03.10.2015 / 20:14