title: Extract data from a promise Object or Array
body: <blockquote>
    <p>I have an API that returns json. The json has 100 objects, each having
    image url and description of the image. I use ng-repeat to show the
    images and modal attached that pops-up when I click the images with
    its description.</p>
  </blockquote>
  
  <p>I have 2 templates and 2 controllers for the normal and modal components. I already have images on my HTML and I just need to pass the same data returned from the factory into the ModalInstanceController so that I can show description on image-click.</p>
  
  <blockquote>
    <p>Do I need to call the factory method to get the data inside the
    ModalInstanceController or pass the data from controller (which is an
    array that contains promise with resolve). The issue is I passed the
    ietms with resolve but can't extract it inside ModalInstanceController as
    it's an array containing promise (in console it says 'value was evaluated just now' and I can't use .then() to an array.</p>
  </blockquote>
  
  <p>My code structure is :</p>
  
  <p><strong>JSON Factory</strong></p>
  
  <pre><code>(function() {
    angular
      .module('Brastlewark')
      .factory('GnomeFactory', GnomeFactory)
  
    function GnomeFactory($http) {
      let allGnomes = { getAllGnomes }
  
      function getAllGnomes() {
        const url = 'https://raw.githubusercontent.com/rrafols/mobile_test/master/data.json'
        return $http.get(url)
          .then(response =&gt; response.data.Brastlewark)
      }
      return allGnomes
    }
  })()
  </code></pre>
  
  <p><strong>Main Controller that opens modal-instance</strong></p>
  
  <pre><code>(function() {
    angular
      .module('Brastlewark')
      .controller('DetailsController', DetailsController)
  
    function DetailsController(GnomeFactory, $log, $uibModal) {
      let vm = this
  
      GnomeFactory.getAllGnomes()
        .then((data) =&gt; {
          vm.gnomeList = data
          return vm.gnomeList
        })
  
      // opening modal window to trigger model instance controller to act
      vm.showModal = (index) =&gt; {
        $log.log(`Button with index ${index} was clicked !!`)
        let configModal = {
          animation: true,
          templateUrl: 'myModal.html',
          size: 'sm',
          controller: 'ModalController',
          resolve: {
            gnomeData: () =&gt; vm.gnomeList
          }
        }
        let modalInstance = $uibModal.open(configModal)
        modalInstance.result.then(console.log, console.log)
      }
    }
  })()
  </code></pre>
  
  <p><strong>ModalController</strong></p>
  
  <pre><code>angular
    .module('Brastlewark')
    .controller('ModalController', ModalController)
  
  function ModalController($scope, $uibModalInstance, $log, gnomeData) {
  
    $scope.gnomeList = gnomeData
    $scope.ok = function() {
      $uibModalInstance.close($scope)
    }
    $scope.cancel = () =&gt; {
      $uibModalInstance.dismiss('cancel')
    }
  }
  </code></pre>
  
  <p><strong>Template for both</strong></p>
  
  <pre><code>    &lt;section id="details"&gt;
        &lt;ul&gt;
          &lt;li ng-repeat="gnome in vm.gnomeList"&gt;
            &lt;button type="button" ng-click="vm.showModal($index)"&gt;
              &lt;img ng-src={{gnome.thumbnail}}&gt;
            &lt;/button&gt;
          &lt;/li&gt;
        &lt;/ul&gt;
      &lt;/section&gt;
  
      &lt;!-- @modal template start --&gt;
      &lt;script type="text/ng-template" id="myModal.html"&gt;
        &lt;div class="modal-body" id="modalbody"&gt;
          &lt;ul&gt;
            &lt;p&gt;Friends : &lt;/p&gt;
            &lt;li ng-repeat="friend in gnomeList.friends"&gt;
              &lt;span&gt;{{friend}}&lt;/span&gt;
            &lt;/li&gt;
          &lt;/ul&gt;
          &lt;div class="modal-footer"&gt;
            &lt;button class="btn btn-primary" type="button" ng-click="ok()"&gt;OK&lt;/button&gt;
            &lt;button class="btn btn-warning" type="button" ng-click="cancel()"&gt;Cancel&lt;/button&gt;
          &lt;/div&gt;
      &lt;/script&gt;
  </code></pre>
  
  <p>NOTE: IT SHOWS MODAL AND INDEX OF IMAGE CLICKED... But doesn't receive the array.</p>