Ионное изображение изображения изображения на новый экран ($ state.go)

Question

У меня есть сетка с фотографиями, и я бы хотел, чтобы щелкнуть позицию выбора, чтобы перейти на полный экран (используя $ state.go). Я реализовал все вещи, но позиция индекса всегда равен 0. Это мой код:

экран Сетка (secure.html):

<ion-view title="My Images" ng-init=""> 
<ion-nav-buttons side="right"> 
    <button class="button button-icon icon ion-camera" ng-click="upload()"></button> 
</ion-nav-buttons> 
<ion-content> 
    <div class="row" ng-repeat="image in images" ng-if="$index % 4 === 0"> 
     <div class="col col-25" ng-if="$index < images.length" ng-click="fullscreen($index)"> 
      <ion-scroll zooming="true" style="width: 100%; height: 100%"> 
       <img ng-src="data:image/jpeg;base64,{{images[$index].image}}" width="100%" /> 
      </ion-scroll> 
     </div> 
     <div class="col col-25" ng-if="$index + 1 < images.length" ng-click="fullscreen($index+1)"> 
      <img ng-src="data:image/jpeg;base64,{{images[$index + 1].image}}" width="100%" /> 
     </div> 
     <div class="col col-25" ng-if="$index + 2 < images.length" ng-click="fullscreen($index+2)"> 
      <img ng-src="data:image/jpeg;base64,{{images[$index + 2].image}}" width="100%" /> 
     </div> 
     <div class="col col-25" ng-if="$index + 3 < images.length" ng-click="fullscreen($index+3)"> 
      <img ng-src="data:image/jpeg;base64,{{images[$index + 3].image}}" width="100%" /> 
     </div> 
    </div> 
</ion-content> 

app.js:

imageApp.config(function($stateProvider, $urlRouterProvider) { 
$stateProvider 
    .state("firebase", { 
     url: "/firebase", 
     templateUrl: "templates/firebase.html", 
     controller: "FirebaseController", 
     cache: false 
    }) 
    .state("fullscreen", { 
     url: "/fullscreen", 
     templateUrl: "templates/fullscreen.html", 
     controller: "SecureController", 
     params:  {'index': null, 'anotherKey': null} 
    }) 
    .state("secure", { 
     url: "/secure", 
     templateUrl: "templates/secure.html", 
     controller: "SecureController" 
    }), 
$urlRouterProvider.otherwise("/firebase");}); 


imageApp.controller("SecureController", function($state, $scope, $ionicHistory, $firebaseArray, $cordovaCamera) { 


$scope.images = []; 
$scope.index = 0; 

var fbAuth = fb.getAuth(); 
if(fbAuth) { 
    var userReference = fb.child("users/" + fbAuth.uid); 
    var syncArray = $firebaseArray(userReference.child("images")); 
    $scope.images = syncArray; 
} else { 
    $scope.go("firebase"); 
} 


$scope.fullscreen = function(index) { 

    $scope.index = index; 
    //$state.go("fullscreen", { 'index':index }); 
    $state.go('fullscreen', { 'index': index, 'anotherKey': 'This is a test' }) 
} 

$scope.upload = function() { 
    var options = { 
     quality : 75, 
     destinationType : Camera.DestinationType.DATA_URL, 
     sourceType : Camera.PictureSourceType.CAMERA, 
     allowEdit : true, 
     encodingType: Camera.EncodingType.JPEG, 
     popoverOptions: CameraPopoverOptions, 
     targetWidth: 500, 
     targetHeight: 500, 
     saveToPhotoAlbum: false 
    }; 
    $cordovaCamera.getPicture(options).then(function(imageData) { 
     syncArray.$add({image: imageData}).then(function() { 
      alert("Image has been uploaded"); 
     }); 
    }, function(error) { 
     console.error(error); 
    }); 
}}); 

Наконец полный экран (fullscreen.html), когда любой ПИК щелкнул:

<ion-view title="Image Full screen" ng-init=""> 
<ion-content> 
     <div class="col col-100"> 
      <img ng-src="data:image/jpeg;base64,{{images[index].image}}" width="100%" /> 
     </div> 
</ion-content> 

Это редко, потому что «образы» читается правильно, но «индекс» всегда 0 значение, я уже начал пытаться с помощью вар, как образы, я имею в виду:

$scope.images = []; 
$scope.index = 0; 

Эти строки получают массив изображений, но индекс изменяется только в контроллере.js, но в fullscreen.html есть 0 ..... Я понятия не имею, что такое happennig

Answer 1

вы можете создавать службы «Контекст», где вы пишете свое «активное изображение» " дорожка. , так что вам не нужны параметры состояния.

Кроме того, это не решить, почему $ индекс imutable ...

Exemple услуги На:

`angular.module('app.contextService', []) 
.service('sContext', function sContext ($log) { 
var me = this; 
me.index = null; 
`}) 

вводят его в контроллер карты:

 .controller('cardControler', function cardControler($scope, $log,sContext) { 

$scope.fullscreen = function(index) { 

    sContext.index = index 
    $state.go('fullscreen') 
} 

    }) 

и в полноэкранном режиме:

Псевдоним использования - хорошая практика. , но если это вас беспокоит, вы можете опубликовать var var в $ scope. (me => $ scope). за исключением услуг, у которых нет $ сфера, конечно