2016-12-19 2 views
0

Я хочу создать веб-страницу с текстовой областью (или текстовым редактором), и я хочу показать некоторые сообщения журнала в поле, которое сообщения журнала будут добавляться постепенно. Рассмотрим, когда мы устанавливаем приложение, оно показывает журналы о том, что происходит постепенно.Периодически регистрировать события в текстовом поле html

У меня уже есть страница с помощью редактора (редакторов АСИ), который показывает данные, но у меня есть некоторые проблемы:

  1. При добавлении данных содержимого редактора, все коробки обновляются.
  2. Помимо обновления, курсор появляется в начале окна вместо размещения в конце.

Пожалуйста, помогите мне найти компонент записи для регистрации событий на веб-странице. Спасибо.

Html код сторона:

<button 
     data-toggle="modal" href="#edit_file_content_modal" 
     ng-click="process(migrateResult)" 
     class="btn btn-icon-only red" 
     uib-popover="Log"> 

     <i class="fa fa-newspaper-o"></i> 
</button> 

<div class="modal fade" id="edit_file_content_modal" tabindex="-1" role="dialog" aria-labelledby="edit_file_content_modal"> 
<div class="modal-dialog modal-lg" role="document"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span 
        aria-hidden="true">&times;</span></button> 
      <h4 class="modal-title" id="edit_file_content_modal-title">File Content</h4> 
     </div> 
     <div class="modal-body"> 

      <div> 
       <code-editor 
         code-model="content" 
         header-title="header"> 
       </code-editor> 
      </div> 



      <div> 
       <div class="modal-footer"> 
        <button type="button" ng-click="saveFile()" class="btn btn-default" ng-disabled=false> 
         Save 
        </button> 
        <button type="button" class="btn btn-danger" data-dismiss="modal" ng-click="cancelCallback()"> 
         Cancel 
        </button> 
       </div> 
      </div> 
     </div> 
    </div> 
</div> 

И в файле JS, я слушаю на событие и добавить полученные данные к содержанию редактора и применить изменения:

io.socket.on(obj.migrateSourceOwner.sourceFile, function (data) { 
    $scope.content += ("\n" + data); 
    $scope.$apply(); 
}); 
+0

Пожалуйста, покажите свой код. – Mairaj

+0

@ Leopard: добавлены некоторые части кода. –

ответ

1

здесь простой js образец для обновления текстового поля надеюсь, что это может быть полезно

var txt = document.getElementById('log'); 
 

 
setInterval(function(){ 
 
txt.value += '\ntest'; 
 
},2000);
<textarea id='log' rows=50 cols=60 autofocus> 
 

 

 
</textarea>

+0

Спасибо за ваш ответ, кажется, он решает мою первую проблему, но когда я запускаю фрагмент кода, он не отображает последнее сообщение. Я имею в виду, что он не автопрокручивает последнее сообщение. –

+0

вам нужно сфокусировать свое текстовое поле или директиву после обновления значения – azad

+0

Как я мог это сделать? –