根据实际模板进入特定滑块的按钮

时间:2015-11-16 11:19:58

标签: angularjs modal-dialog ionic-framework ionic

我有一个“帮助”按钮,会弹出一个带滑块的模态窗口。我想要做的是让“帮助”按钮带你到特定的幻灯片,具体取决于你是什么页面,所以如果你在“登录”模板,帮助将带你到里面的“登录”幻灯片帮助滑块等。

这是我的按钮:

<div ng-controller="ToggleCtrl">  
          <button class="cabecera__link-ayuda" ng-click="modal.show()"><i class="ion-help-circled"></i></button>
        </div>

这是我的滑块:

<script id="ayuda.html" type="text/ng-template">
  <ion-modal-view class="modal-ayuda">
    <ion-header-bar class="bar bar-header">
      <h1 class="title">Ayuda</h1>
      <button class="button button-clear button-primary" ng-click="modal.hide()"><i class="ion-close"></i></button>
    </ion-header-bar>  
    <ion-view title="Ayuda"> 
      <ion-slide-box on-slide-changed="slideHasChanged(index)">
        <ion-slide>
          <ion-content>
            <h1 class="texto-azul centrado">APP BSRenting</h1>
            <h2>Bienvenido</h2>
            <p>Esta Aplicación permite registrar las incidencias asociadas al servicio de renting de vehículos.</p>
            <p>La aplicación que se plantea es una app in-house que facilite la comunicación entre los usuarios de BSRenting y el Contact Center, para la gestión de los partes de accidentes, averías, mantenimiento y robo. El proyecto se incluye en la iniciativa de creación de la app, la Web y la base de datos para gestionar la información, esta propuesta se centra únicamente en la App para dispositivos móviles, los servicios para almacenamiento y consulta de la información y la base de datos para almacenarla.</p>
          </ion-content>  
        </ion-slide>
        <ion-slide>
          <ion-content>
            <h1 class="texto-azul centrado">APP BSRenting: Login</h1>
            <div class="centrado">
              <img src="img/screen-login.jpg"/>
            </div>  
            <p>Al iniciar la aplicación el usuario verá su pantalla la pantalla de login, dicha pantalla de solicitaría matrícula y password. Además hay un botón de registrarse.</p>
          </ion-content>  
        </ion-slide>
        <ion-slide>
          <ion-content>
            <h1 class="texto-azul centrado">APP BSRenting: Registro</h1>
            <div class="centrado">
              <img src="img/screen-registro.jpg" />
            </div>  
            <p>En el apartado registrarse, el usuario introducirá DNI, Matrícula, email, teléfono y password. Una vez se seleccione registrarse, se realizaran una serie de validaciones en el servidor y de estar todo correcto, se le enviará un correo electrónico con los datos para finalizar su registro.</p>
          </ion-content>  
        </ion-slide>
        <ion-slide>
          <ion-content>
            <h1 class="texto-azul centrado">APP BSRenting: Menu</h1>
            <div class="centrado">
              <img src="img/screen-menu.jpg" />
            </div>  
            <p>Una vez entremos en la aplicación se nos deberá mostrar una página donde podremos ver las diferentes opciones de las cuales dispone la aplicación.</p>
          </ion-content>  
        </ion-slide>
      </ion-slide-box> 
    </ion-view>   
  </ion-modal-view>
</script>

这是app.js:

  .controller('ToggleCtrl', function($scope, $ionicModal) {
$ionicModal.fromTemplateUrl('ayuda.html', {
    scope: $scope,
    animation: 'slide-in-up'
}).then(function (modal) {
    $scope.modal = modal;
});
})  

0 个答案:

没有答案