动态添加元素的指令不起作用 [英] Dynamically added element's directive doesn't work

问题描述

我想建立一个简单的无限滚动。它加载数据不错，但加载后，新添加的元素指令不工作。

I'm trying to build a simple infinite scroll. It loads the data fine but after loading, new added elements' directives don't work.

这是滚动检查和数据加载指令的相关部分。

This is relevant part of the scroll checking and data loading directive.

.directive("scrollCheck", function ($window, $http) {
     return function(scope, element, attrs) {
          angular.element($window).bind("scroll", function() {           
                // calculating windowBottom and docHeight here then
                if (windowBottom >= (docHeight - 100)) {
                    // doing some work here then            
                    $http.get('service page').then(function (result) {
                        if (result.data.trim() != "") {
                            var newDiv = angular.element(result.data);  
                            element.append(newDiv);                                                             
                        } 
                        // doing some other work
                    },function () {
                        // error handling here
                    });                                 
                }                    
                scope.$apply();
          });
     };
})

服务页面返回此结构的某些重复为 result.data

<div ...>
    <div ... ng-click="test($event)"></div>
    <div ...>...</div>
</div>

正如我所说的数据加载得很好，但那些测试（）在 NG-点击功能指令不工作。如何让时间工作？

As i said data loads just fine but those test() functions in ng-clickdirectives don't work. How to get em work?

推荐答案

我相信你会需要编译html元素返回。事情是这样的。

I believe you are going to need to compile the html element returned. Something like this

         $compile(newDiv)(scope);  // Corrected. Thanks

您将需要确保，并通过在$编译到你的函数

You'll need to be sure and pass in $compile into your function

这篇关于动态添加元素的指令不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！