У меня есть модальный для отправки сообщения, и для того, чтобы показать клавиатуру, я должен установить фокус на textarea
после запуска модального.Правильный способ показать ионный модальный текст и клавиатуру
HTML
<script id="new-post.html" type="text/ng-template">
<div class="modal">
<form ng-submit="sendPost(post)">
<ion-header-bar class="bar-royal">
<button class="button button-clear button-light" ng-click="closeNewPost()">Cancel</button>
<h1 class="title">New Message</h1>
<button type="submit" class="button button-clear">Post</button>
</ion-header-bar>
<ion-content>
<div class="list">
<label class="item item-input">
<textarea class="textareas" id="postMessageInput" ng-model="$parent.post.message" placeholder="What do you want to say?" autofocus ></textarea>
</label>
</div>
</ion-content>
</form>
</div>
Контроллер:
$ionicModal.fromTemplateUrl('new-post.html', function(modal) {
$scope.postModal = modal;
}, {
scope: $scope,
focusFirstInput: true
});
$scope.newPost = function() {
$scope.postModal.show().then(document.getElementById('postMessageInput').focus());
};
Что происходит, что модальной скользит вверх, а затем клавиатура скользит вверх. Иногда появляется мерцание экрана, в то время как модальный первый показывает. Весь опыт не является гладким. Иногда textarea даже подталкивается под модальным заголовком.
В идеале, я хочу, чтобы модальный слайд вверх с клавиатурой, уже отображенной на экране, как будто клавиатура встроена в модальную. Вот как работают другие приложения (ios). Возможно ли это, или есть стандартный метод для показа модала с клавиатурой и текстовой областью?
Я хотел бы добавить, что когда клавиатура отображается (только из-за фокусом быть установлены на текстовом поле), что фокус больше не находится в текстовом поле, и вам нужно щелкнуть в текстовой области до ввода. – lilbiscuit