Событие триггера oncontextmenu в элементе textarea Angularjs

Question

Я использую библиотеку пакетов для Angularjs от here. Он работает нормально, но я узнал, что я не могу редактировать контент textarea, когда я нажимаю на него. Проведя некоторое время, я смог сделать его редактируемым, когда я нажимаю правой кнопкой мыши на элементе textarea, но он все равно не работает, если я нажму на него. Итак, теперь я пытаюсь вручную инициировать событие правого клика, когда я нажимаю на текстовое поле, чтобы он редактировал элемент.

Вот код

<packery ng-model="files" gutter="12" style="border:0px solid black;width:710px;" > 

     <packery-object ng-init="user_text='Write something ...';" class="large text sans-font medium-font box-border-raduis"> 
      <div class="hidden-overflow sans-font medium-font" style="clear: both; border: 0px solid purple; 
         background: white; border-top: 6px solid #00a2d3; padding: 10px; "> 
        <textarea id="Mytextarea" contenteditable="true" style="margin: 0px;" 

          ng-click="click();" 
          >{{user_text}} 
        </textarea> 
      </div> 
     </packery-object> 
</packery> 

и вот функция мыши(), который пытается вызвать oncontextmenu (правой кнопкой мыши) событие:

$scope.click = function(){ 
      console.log('clicked!'); 
      var e = angular.element(document.querySelector('#Mytextarea')); 
      console.log(e); 
      angular.element(e).triggerHandler("oncontextmenu"); 

     }; 

Но не похоже, работает это решение , Что я делаю не так?

Answer 1

Я бы определенно рекомендовал выяснить, что мешает вам сосредоточиться на текстовом поле, так как нажимать на него, и фокусировка - это поведение по умолчанию, однако вы можете попытаться вместо того, чтобы обернуть div, чтобы текстовая область использовала метку, для»атрибута текстового поля в идентификаторе, например:

<label for="Mytextarea" class="hidden-overflow sans-font medium-font" ...> 
     Textarea here 
</label> 

Я обычно не принимаю это, так как метка является встроенным элементом и текстовое поле представляет собой блок-элемент, но в вашем случае это может помочь вам.

Для отслеживания того, что мешает вам сосредоточиться, я бы рекомендовал щелкнуть правой кнопкой мыши на элементе textarea> inspect, а затем на вкладке «Элементы» в инструментах Chrome dev найдите вкладку «Слушатели событий» (должен быть расположен в правом углу окна) должны быть в состоянии видеть всех слушателей, которые были связаны с этим элементом, и могут помочь вам отслеживать источник проблемы.