Init angular-slick-slider на pagePush

<ons-template id="atendimento.html">
  <ons-page id="atendimento" ng-controller="MyCtrl" >
    <ons-toolbar>
      <section class="left">
        <ons-toolbar-button onclick="fn.open()">
          <ons-icon icon="menuic"></ons-icon>
        </ons-toolbar-button>
      </section> 
      <section class="center">
        Atendimento
      </section>
    </ons-toolbar>

    <section class="showConsultores" ng-app="MyApp" >     
      <section class="slick-container">
        <slick infinite=true slides-to-show=3 slides-to-scroll=3>
          <section class="slick-item" ng-repeat="image in images">
            <div><img src="{{ image.url }}" /></div>
          </section>
        </slick>
      </section>   
    </section><!-- showCOnsultores -->

  </ons-page>
</ons-template>

У меня есть скользкий слайдер на ONS-шаблоне, и мне нужно, чтобы инициализировать, когда этот шаблон/страница толкнут. Как я могу это сделать?
У меня есть шаблон и div в него с ng-app= «MyApp» и ng-controller= » MyCtrl»

Вот что я уже сделал:

var app = angular.module('MyApp', ['slickCarousel'])
  .controller('MyCtrl', MyCtrl);

function MyCtrl($http, $scope, $interval) {

  $scope.images = [{
    url: 'http://1.gravatar.com/avatar/7b87e6452c01724c8e917c4e08dce2f7?s=90&d=mm&r=g'
  }, {
    url: 'http://www.guiadafarmacia.com.br/images/resized/images/screen_shot_2015-04-30_at_3_90_90.png'
  }, {
    url: 'http://www.guiadafarmacia.com.br/images/resized/images/screen_shot_2015-04-30_at_3_90_90.png'
  }, {
    url: 'http://www.guiadafarmacia.com.br/images/resized/images/screen_shot_2015-04-30_at_3_90_90.png'
  }, {
    url: 'http://www.guiadafarmacia.com.br/images/resized/images/screen_shot_2015-04-30_at_3_90_90.png'
  }, {
    url: 'http://www.jmensura.com.br/img/call_center.jpg'
  }];
}

1 ответ

  1. Из документации модуля видноng-if, что для инициализации карусели используется равнина:

    <slick ng-if="numberLoaded">
        <div ng-repeat="i in number">
            <div class="" ng-include="'tpl.html'"></div>
        </div>
    </slick>
    

    Вы можете установить numberLoaded(или какой-либо другой флаг триггера) на вашей функции разрешения состояния/маршрута. Не уверен, если это помогает