AngularJS指令事件监听器未触发

Question

我有这样的指令：

<div ng-repeat="(key, value) in $parent.item.detailedPlan track by $index">
  <ul contenteditable="true" class="plan-actions" data-placeholder="Add Plan ...">
    <li ng-repeat="planItem in value" ng-show="(key+1)==$parent.dayItem.value">
      {{planItem}}
    </li>
  </ul>
</div>

和这样的指令函数：

.directive('planText', function(){
      return {
        restrict:'E',
        templateUrl: 'app/partials/planText.html',
        link: function(scope, element, attrs){

          element.find("ul").bind('keydown', function(event){
            console.log("keydown event");
          if (event.keyCode == 8) {
            // console.log("backspace pressed");
            if ($(this).children().length == 1 && $(this).children("li").text().split("").length == 0) {
                console.log("stop li removal");
                event.preventDefault();
            }
          }
        });
        element.find("ul").bind('focus', function(event){
            if ($(this).children().length ==0 ) {
                console.log("insert li");
                $(this).append("<li></li>");
            }
        });
        }
      }
})

它从中读取的数据结构是一个数组数组。 但是，两个事件侦听器功能均不会触发。 添加$ compile也无济于事。 请帮忙 ！

Answer 1

检查此代码笔

问题是当您在指令中使用ng-repeat时发生了此问题，是因为在创建元素时触发了链接，但是ng-repeats在此之后开始工作，因此您可以通过在绑定之前添加$timeout来解决此问题。

这个问题是AngularJS指令在元素完全加载之前运行的重复