2014-10-04 11 views
6

Próbuję użyć $ ionicPopup do obsługi logowania/rejestracji w mojej aplikacji. Otwieram go z usługi, więc utworzyłem nowy zakres i dołączam go do ionicPopup. Wygląda smth tak:

$ionicPopup.show 
    template: ''' 
    <form name="loginForm" novalidate> 
     ... 
    </form> 
    ''', 
    scope: $scope, 
    buttons: [ 
    { 
     text: 'Cancel', 
    }, 
    { 
     text: '<b>Save</b>', 
     type: 'button-positive', 
     onTap: (e) -> 

     form = $scope.loginForm #why is it undefined? 
    } 
    ] 

więc nazwałem formularz jak LoginForm i chcę do niego dostęp wewnątrz funkcji ONTAP obsługiwać walidacji. Ale loginForm nie istnieje w $ scope, tak jak w normalnej formie sprawdzania poprawności wewnątrz kontrolera. Więc masz pojęcie, jak powinienem obsłużyć sprawdzanie poprawności tutaj?

Dzięki!

+0

Możesz użyć sprawdzania html5 w swoim formularzu –

+0

Niestety to mi nie wystarcza. Chciałbym skorzystać z ngFormController i ngModelController do obsługi sprawdzania poprawności, ale podany zakres $ $ nie ma tych wartości. – gsanta

+0

Awesome nawet ja utknąłem na ten sam problem i powodem, dla którego go nie zdefiniowano, jest to, że Ionic tworzy nowy zakres na popup jak widać https://github.com/driftyco/ionic/blob/master/js/angular/ service/popup.js # L17 linia 280. Nadal zastanawiam się, dlaczego tak się dzieje. Wszelkie wskazówki każdy. – Zaje

Odpowiedz

8

Wymyśliłem brzydkie, ale działające rozwiązanie, z którego obecnie korzystam. Jeśli podasz ionicpopup templateUrl, zamiast łańcucha o sztywnym kodowaniu, możesz użyć standardowego kontrolera wewnątrz szablonu, który dokonuje sprawdzenia poprawności.

W tej chwili usunąłem wszystkie przyciski związane z jonopopupem (mimo to uznałem je za naprawdę niezręczne) i podałem niezbędne przyciski wewnątrz szablonu.

I w ten sposób mogę kontrolować stan na ionicpopup jest ze sterownika (na przykład zamykając okienko)

Tomorrow utworzyć przykład jsFiddle, w przypadku, ktoś jest zainteresowany.

Ale jeśli masz jakieś lepsze rozwiązanie, proszę podzielić: D

+2

Czy możesz podzielić się przykładem jsFiddle, o którym wspomniałeś? –

+0

dziękuję, w końcu działało tak jak powiedziałeś +1 –

+0

jedynym problemem jest to, że twoje przewijane wyskakujące okienka z powodu przesuwania klawiatury w przyciskach są niewidoczne – mtpultz

0

znalazłem rozwiązanie, że pracuje dla mnie. Wszystko, co musisz zmienić to zdefiniować w kontrolerze swój formularz:

$scope.form = { 
    loginForm: {} 
}; 
    $ionicPopup.show 
     template: ''' 
     <form name="form.loginForm" novalidate> 
      ... 
     </form> 
     ''', 
     scope: $scope, 
     buttons: [ 
     { 
      text: 'Cancel', 
     }, 
     { 
      text: '<b>Save</b>', 
      type: 'button-positive', 
      onTap: (e) -> 

      form = $scope.form.loginForm 
     } 
     ] 
0

Używając mojego rozwiązania, nie musisz usuwać jonowych przycisków popup.
Co można zrobić, aby sprawdzić, to za pomocą narzędzia Ng-Model. Nie trzeba używać <form>. Usuwam więc <form>.

$ionicPopup.show 
    template: '<input name="username" ng-model="data.username">', 
    scope: $scope, 
    buttons: [ 
    { 
     text: 'Cancel', 
    }, 
    { 
     text: '<b>Save</b>', 
     type: 'button-positive', 
     onTap: (e) 
     var user_name = $scope.data.username 
     // do validation here 
     if(user_name != 'undefined') { 
      ... 
     } 
    } 
    ] 

Wolę nie usuwać jonowych przycisków popup. Mam nadzieję, że przyda się innym.
Pozdrawiam!