Coś w stosie cordova/kątowym/jonowym kradnie moje skupienie

Question

Aby zapewnić dostępność muszę ustawić ostrość elementów podczas wprowadzania ekranów w mojej aplikacji Cordova. Przy odrobinie sztuczek udało mi się ustawić skupienie na elemencie, ale element natychmiastowo traci skupienie (weryfikowane przez słuchanie zdarzenia "rozmycie"), a strata sięga przed Apples VoiceOver, Androids Talkback kopie lub użytkownik może wziąć jakiekolwiek działania.

Próbowałem już owijać ustawienie fokusu w $ timeout, aby wymusić to po zakończeniu renderowania, ale to wcale nie pomogło. Przyszło mi do głowy, że coś w Kordobie, kątowe 1 lub jonowe, powoduje, że magia wstrętnego ogniska sama zakłóca kod m.

Czy ktoś doświadczył czegoś podobnego i znalazł sposób na obejście tego problemu?

Answer 1

użyłem następującą dyrektywę do Cordova niejonowych:

app.directive('focusableInput', function($timeout,$log) { 
    return { 
     restrict: 'A', 
     require: 'ngModel', 
     scope: { 
      focusState: "=", 
      onGo: "&" 
     }, 
     link: function(scope, element, attr, ngModel) { 

      var moveCursorToEnd = function(el) { 
       if (typeof el.selectionStart == "number") { 
        el.selectionStart = el.selectionEnd = el.value.length; 
       } else if (typeof el.createTextRange != "undefined") { 
        el.focus(); 
//     var range = el.createTextRange(); 
//     range.collapse(false); 
//     range.select(); 
       } 
      } 

      scope.$watch("focusState", function(state) { 
       $log.debug("focusableInput - focus state change: " + state,element); 
       if (state) { 
        //cordova.plugins.Keyboard.show(); 
        $log.debug("focusableInput - do focus!!!",element); 
        $timeout(function() { 
         element[0].focus(); 
         moveCursorToEnd(element[0]); 
        }, 300); 

        //element[0].focus(); 
       } else { 
        element[0].blur(); 
       } 
      }); 

      element.on("keydown", function(event) { 
       console.log("pressed: " + event.which, event); 
       //$log.debug(attr); 

       if (event.which == 13) { 
        $timeout(function() { 
         scope.onGo(); 
        }); 
       } 
      }); 



      scope.$watch(
        function() { 
         return ngModel.$modelValue; 
        }, 
        function(newValue) { 
         $log.debug("focus input model changed: ", newValue); 

         if (newValue) { 
          var endChar = newValue[newValue.length - 1]; 
          $log.debug("endChar",endChar); 

          if (endChar == " " || endChar == ",") { 
           $timeout(function() { 
            scope.addItem(); 
           }); 
          } 
         } 
        } 
      ); 
     } 
    }; 
}); 

i użytkowania:

<input type="email" placeholder="Email" 
       class="login-custom-input" 
       focusable-input 
       focus-state="textAreaFocusState" 
       ng-model="meeterAccount.email" 
       ng-focus="onSignUpLoginEmailFocus()" 
       ng-blur="onSignUpLoginEmailFocusLost()" 
       > 

focusable-input dyrektywa używa focus-state atrybut

---

nadzieję, że to pomoże.