Estoy tratando de hacerlo, cuando hago clic en el botón enviar aparece una ventana emergente, donde si la persona ingresa el mensaje correcto pasa a la siguiente pantalla si no, permanece en la pantalla que está.

Mi código: mi controller.js

.controller('loginController', function($scope, $stateParams, $ionicPopup, $ionicHistory, $state) {

  $scope.Enviar = function(){


            var confirmPopup = $ionicPopup.prompt({
              title: 'Login',
              template: 'Pergunta: Digite a P∴S∴ do AP∴?',
              inputType: 'text',
              inputPlaceholder: 'Digite a senha',
              ng-model="login"
            });
            confirmPopup.then(function(res) {
               if(res) {
                  $state.go('app.home');

               } else {
                  console.log('teste');
                  $state.go('login');
               }
            })
  }

})

Mi login.html

<ion-view view-title="login">
  <ion-content class="login-principal" scroll="true">
     <div class="login-imagem">
      <img class="full-image" ng-src="img/GOMB.jpg">
     </div>
     <div>
        <ion-list class="list-inset">
          <ion-item class="item-input">
            <i class="icon ion-ios-email-outline placeholder-icon"></i>
            <input type="text" placeholder="E-mail">
          </ion-item> 
          <ion-item class="item-input">
            <i class="icon ion-ios-locked-outline placeholder-icon"></i>
            <input type="text" placeholder="Senha">
          </ion-item> 
        </ion-list>
        <div class="row login">
            <div class = "col col-50" >
              <a class="button button-block button-dark" ui-sref="app.cadastroUsuario">Criar conta</a>
            </div>
            <div class = "col col-50" >  
              <a class="button button-block button-dark" ng-click="Enviar()">Entrar</a>
            </div>
        </div>
      </div>  
  </ion-content>
</ion-view>

Mi pregunta es ¿cómo usar ng-model y ng-if con ionicPopup?

0
Lucas Santos 21 jul. 2017 a las 18:28

2 respuestas

La mejor respuesta
$scope.Enviar = function(){
            var obj = new String("boa");

            $ionicHistory.nextViewOptions({
                    disableBack : true
            })

            var confirmPopup = $ionicPopup.prompt({
              title: 'Login',
              template: 'Pergunta: Digite a?',
              inputType: 'text',
              inputPlaceholder: 'Digite em minusculo'
            });
            confirmPopup.then(function(res) {
               if(res == obj) {
                  $state.go('app.home');
                  console.log(res);
               } else {
                  //console.log('teste');
                  $state.go('login');
                  //console.log(res);
               }
            })
  }
0
Lucas Santos 25 jul. 2017 a las 17:38

En lugar de $ionicPopup.prompt, puede hacer uso de $ionicPopup.show y en la propiedad de plantilla de su objeto escriba la plantilla que desee (con ng-model & ng-if). También puede tener botones con su texto personalizable, así como una acción particular enTap (como devolver el valor del modelo de los campos de entrada dentro de la ventana emergente). Entonces, puede tener la siguiente función para llamar a la ventana emergente:

$scope.showPopup = function() {
   $scope.data = {}
   // An elaborate, custom popup
   var myPopup = $ionicPopup.show({
     template: '<input type="password" ng-if="isNotConnected" 
                ng-model="data.wifi" placeholder="Enter Password">',
     title: 'Enter Wi-Fi Password',
     subTitle: 'Please use normal things',
     scope: $scope,
     buttons: [
       { text: 'Cancel' },
       {
         text: '<b>Save</b>',
         type: 'button-positive',
         onTap: function(e) {
           if (!$scope.data.wifi) {
             //don't allow the user to close unless he enters wifi password
             e.preventDefault();
           } else {
             return $scope.data.wifi;
           }
         }
       },
     ]
   });
   myPopup.then(function(res) {
     console.log('Tapped!', res);
   });

};

Consulte este codepen: https://codepen.io/anon/pen/wqwzPE

1
Shantanu 21 jul. 2017 a las 17:59