Update slide-box content

ionic-v1
1

I’ve been searching for like two or three days and I cannot find a solution to my problem…

This is my slidebox that is loaded in a html iframe

    <ion-content class="has-header has-footer" has-bouncing="false" ng-controller="CamaraCtrl">
        <div id="contenedorImagenNuevoLocal">
            <ion-slide-box id="slideBoxLocal">
                <ion-slide id="slideLocal" ng-repeat="s in fotosSlide">
                    <img class="imagenesLocal" ng-src="{{s.url}}">
                </ion-slide>
            </ion-slide-box>
            <img id="editarImagen" onclick="parent.openModalAnadirFotosLocal();" src="img/icon_picture@2x.png">
        </div>

(That is only a part of the code, in the original code all is closed correctly)

Then I’ve this controller in app.js the default angular script that generates Ionic

.controller('CamaraCtrl', function ($scope, $cordovaCamera, $ionicLoading, $ionicSlideBoxDelegate) {
$scope.picData = [];
var maxImagenes = 0;
var seleccionadas = 0;
var fotosSel = [];

$scope.fotosSlide = [
    {
        url: "img/foto_placeholder.png"
    }
]; 

$scope.guardarFotos = function () {
    maxImagenes = 0;
    seleccionadas = 0;
    closeModalAnadirFotosLocal();
    var imgEl = $(".imagenesAFL");
    for (var i = 0; i < imgEl.length; i++) {
        $(imgEl).attr("src", "");
    }
    $scope.fotosSlide.pop();
    var lpd = $scope.picData.length;
    for (var i = 0; i < lpd; i++) {
        $scope.fotosSlide.push({
            url: $scope.picData.pop()
        });
        $scope.$apply();
    }
    var lfs = fotosSel.length;
    for (var i = 0; i < lfs; i++) {
        fotosSel.pop();
    }
    $ionicSlideBoxDelegate.update();
    $("#btnGuardarFotoLocal").css("display", "none");
    $("#btnBorrarFotoLocal").css("display", "none");
}

Finally I’ve this modal in a html that is the parent of the iframe and I show the modal with display block/none

    <div id="modalAnadirFotosLocal" ng-controller="CamaraCtrl" style="display:none">
    <img on-hold="seleccionarImagen($event)" id="img_local_1" class="imagenesAFL" ng-click="quitarSeleccion($event)" src="">
    <img on-hold="seleccionarImagen($event)" id="img_local_2" class="imagenesAFL" ng-click="quitarSeleccion($event)" src="">
    <img on-hold="seleccionarImagen($event)" id="img_local_3" class="imagenesAFL" ng-click="quitarSeleccion($event)" src="">
    <img on-hold="seleccionarImagen($event)" id="img_local_4" class="imagenesAFL" ng-click="quitarSeleccion($event)" src="">
    <a id="btnGuardarFotoLocal" class="button button-block button-stable btnAFL" ng-click="guardarFotos()">Guardar</a><a id="btnBorrarFotoLocal" class="button button-block button-stable btnAFL" ng-click="borrarFotos()" style="font-weight:bold;">Borrar imágenes</a>
    <a id="btnHacerFotoLocal" class="button button-block button-stable btnAFL" ng-click="hacerFotoLocal()">Hacer foto</a>
    <a id="btnGaleriaLocal" class="button button-block button-stable btnAFL" ng-click="abrirGaleria()">Galería</a>
    <a style="font-weight:bold;" class="button button-block button-stable btnAFL" ng-click="cancelarModal()">
        Cancelar
    </a>
</div>

In my controller I pick some pictures from Android gallery or a took a photo from the camera and I store that photos in an array, then when I click the button “Guardar” I want my slide-box to generate slides with those pictures.

The problem is that I cannot manage to update the slide-box.

Thank you!