AngularJS 1.6 аварийно завершает работу IE 11 с директивой ng-i18next

Question

У меня проблема при запуске приложения AngularJs (1.6) в IE 11, оно вылетает и закрывает браузер, когда пользователь вводит текст и значок эмодзи. 2 из 10-20 раз, я сталкиваюсь с этой проблемой. Я подозревал об утечке памяти, но в то же время, если приложение не требует ввода данных пользователем, оно не дает сбоя. Интересно, кто-нибудь может мне помочь с этим?

Библиотеки:

<script src="js/lib/jquery.js"></script>
<script src="js/lib/lodash.min.js"></script>
<script src="js/lib/angular.min.js"></script>
<script src="js/lib/emoji-picker.min.js"></script>
<script src="js/lib/rzslider.min.js"></script>
<script src="js/lib/angular-rating-icons.js"></script>
<script src="js/lib/ui-bootstrap-tpls.min.js"></script>

Пользовательская часть ввода:

<div ng-if="showInput" class="slide-top" id="inputBox">
  <div class="inputMessageHeader" ng-i18next="chatbot.userinput.title" ng-attr-style="background-color: {{primaryColor}}" style="background-color: {{primaryColor}}"></div>
  <form class="full-height">
    <div layout="row">
      <div flex id="inputUser">
        <textarea maxlength="2000"
                  ng-model="components[currentQaIndex].usrMessage"
                  ng-i18next="[placeholder]chatbot.userinput.placeholder"
                  rows="5" ng-keyup="countCharacters()" 
                  ng-change="hideEmojiPicker()">
        </textarea>
        <div class="counter"><span ng-class="{error: components[currentQaIndex].usrMessage.length > 2000}"> {{components[currentQaIndex].usrMessage.length || 0}} </span> / 2000</div>
      </div>
      <div id="gifArea" ng-if="messageGifUrl" flex="45">
        <img ng-src="{{messageGifUrl}}" />

        <md-button id="gifEdit" ng-click="toggleGifPopup()" aria-label="edit" class="md-icon-button launch fa fa-pencil-square-o"></md-button>
        <md-button id="gifDelete" ng-click="deleteGif()" aria-label="delete" class="md-icon-button launch fa fa-trash-o"></md-button>
      </div>
    </div>
    <div id="separatorLine"></div>
    <div class="form-action">
      <div class="gif-btns">
        <div emoji-picker="components[currentQaIndex].usrMessage" title="Emoji" placement="top" output-format="unicode" class="emoji" ng-click="toggleEmojiPicker()" ng-class="{active: emojiVisible}" on-change-func="hideEmojiPicker">
        </div>
        <span class="gif" ng-click="toggleGifPopup()" ng-class="{active: gifPopupVisible}"></span>
        <span class="gallery"></span>
        <span class="camera"></span>
      </div>
      <div class="btns" >
        <span ng-i18next="chatbot.calltoactions.cancel" class="blink-btn" ng-attr-style="color: {{primaryColor}}; border-bottom-color: {{primaryColor}}" style="color: {{primaryColor}}; border-bottom-color: {{primaryColor}}" ng-mouseenter="setDarkerColor($event)" ng-mouseleave="setPrimaryColor($event)" ng-click="onCancelQuestion()" ng-if="isOther" ></span>
        <span ng-i18next="chatbot.calltoactions.ok" class="blink-btn" ng-attr-style="color: {{primaryColor}}; border-bottom-color: {{primaryColor}}" style="color: {{primaryColor}}; border-bottom-color: {{primaryColor}}" ng-mouseenter="setDarkerColor($event)" ng-mouseleave="setPrimaryColor($event)" ng-click="onSaveUserMessage($event)" ng-if="isOther"></span>

        <span ng-i18next="chatbot.calltoactions.validate" class="blink-btn" ng-attr-style="color: {{primaryColor}}; border-bottom-color: {{primaryColor}}" style="color: {{primaryColor}}; border-bottom-color: {{primaryColor}}" ng-mouseenter="setDarkerColor($event)" ng-mouseleave="setPrimaryColor($event)" ng-click="onSubmitAnswer($event)" ng-if="!isOther"></span>
        <span ng-i18next="chatbot.calltoactions.skip" class="blink-btn" ng-attr-style="color: {{primaryColor}}; border-bottom-color: {{primaryColor}}" style="color: {{primaryColor}}; border-bottom-color: {{primaryColor}}" ng-mouseenter="setDarkerColor($event)" ng-mouseleave="setPrimaryColor($event)" ng-click="onSkipQuestion($event)" ng-if="components[currentQaIndex].options.is_skippable && !isOther" ></span>
      </div>
    </div>
  </form>
</div>

Answer 1

У вас плохой код при вводе данных пользователем, и это единственный вывод, который я могу сделать из того, что вы говорите. Разместите некоторый код или проверьте пользовательский ввод, вы, вероятно, выполняете цикл или рекурсию или слишком много циклов дайджеста. Кстати, вы можете повторить и повторить на других браузерах? Наблюдайте за использованием памяти и процессора в IE, когда вы вводите данные. С твоего конца что-то не так, если только не сломан угол; Однако я бы не стал делать такой вывод.

Обновить

<textarea maxlength="2000" ng-model="components[currentQaIndex].usrMessage"
          ng-i18next="[placeholder]chatbot.userinput.placeholder" rows="5"
          ng-keyup="countCharacters()" ng-change="hideEmojiPicker()"> 
</textarea>

использовать какой-то ng-model-option с откровением здесь. что такое countCharacters? Вы можете просто сделать. длина на модели или использовать $viewValue.length Я не вижу ничего в основном неправильного, какую-то оптимизацию, которую можно сделать, но здесь ничто не должно полностью умереть. Протестируйте это в chrome и других браузерах и используйте точки останова и ведение журнала, чтобы понять, почему происходит сбой.