2017-05-03 4 views
0

Ich habe Code, der eine Zeichenfolge in die Mitte einer anderen Zeichenfolge in einem Texteingabefeld einfügt. Ich möchte den Cursor an das Ende der Zeichenfolge setzen, die ich gerade eingefügt habe. Ich kann sehen, dass die Cursorposition korrekt ist, nachdem ich sie platziert habe. Zu dem Zeitpunkt, zu dem die Seite das Rendern beendet hat, befindet sich der Cursor jedoch am Ende des Eingabefeldes.Was bewegt meine Cursorposition?

Ich rate etwas anderes berührt die Daten, nachdem ich es platziere. Ich bin mit der Codebasis nicht vertraut. Irgendwelche Hinweise, wie man das aufspürt? Gibt es ein Auswahl-Event?

lieh ich mir den Code, um die Positionierung von hier zu tun: Set Cursor Position in Textarea using AngularJS

Hier ist mein Code:

$scope.insertItem = function (insertText) { 
     var currentText= $scope.markup; 
     // The text is correctly stitched together. No issues here 
     currentText = currentText.substr(0, $scope.curentPosition) + insertText + currentText.substr($scope.curentPosition); 
     $scope.markup = currentText; 
     // The caretPos is correctly calculated here 
     $scope.caretPos = $scope.curentPosition + insertText.length; 
     document.getElementById("markup").focus(); 
     $scope.setCaretToPos("markup", $scope.caretPos); 
    } 

    $scope.setCaretToPos = function (fieldName, caretPos) { 
     $scope.setSelectionRange(document.getElementById(fieldName), caretPos, caretPos); 
    }; 

    $scope.setSelectionRange = function (input, selectionStart, selectionEnd) { 
     if (input.setSelectionRange) { 
      // The code comes down this path 
      input.focus(); 
      // document.getElementById("markup").selectionStart is correct after this lone 
      input.setSelectionRange(selectionStart, selectionEnd); 
     } 
     else if (input.createTextRange) { 
      var range = input.createTextRange(); 
      range.collapse(true); 
      range.moveEnd('character', selectionEnd); 
      range.moveStart('character', selectionStart); 
      range.select(); 
     } 
    }; 

Antwort

0

Falls jemand in diese läuft. Ich nehme an, ein Beobachter auf dieser Seite hat die Eingabe neu gerendert, nachdem ich den Cursor dort platziert habe, wo ich es haben wollte. Anstatt zu versuchen, herauszufinden, was das war und die Reihenfolge der Beobachter, die wahrscheinlich zerbrechlich sein würden, zu ändern, entschied ich mich, den Cursor hinter die Seite gestellt zu platzieren. Um herum zu suchen, war die Lösung, etwas nach dem Seiten-Rendering ausführen zu lassen, $ timeout mit einem Timeout-Wert von 0 zu verwenden (scheint für mich ein riesiger Hack zu sein). So etwas wie das Folgende:

$timeout(function() { 
       $scope.setCaretToPos("markup", $scope.caretPos) }, 
     0); 

Sie müssen $ Timeout in Ihren Controller injizieren. Etwas wie:

ctrl.$inject = ['$scope', '$timeout']; 
var ctrl = function ($scope, $timeout)