Javascript 动态创建的Div中的Angular ng click不起作用

我在Angular controller内的HTML页面中添加了一些div：

但是在这些动态创建的Div中，ng click不起作用！为什么？

所以在“Hi”之后不是jQuerymytag

你应该：

function myTag() {

    return {
        link: function(element) {
            element.after('<div ng-click="sayHi()">Hi</div>');
        }
    }
}
angular.module('yourModule').directive('myTag', myTag);

<my-tag></my-tag>   or   <div my-tag></div>

因此，在“Hi”之后不是jQuerymytag

你应该：

function myTag() {

    return {
        link: function(element) {
            element.after('<div ng-click="sayHi()">Hi</div>');
        }
    }
}
angular.module('yourModule').directive('myTag', myTag);

<my-tag></my-tag>   or   <div my-tag></div>

---

angular仅在第一次初始化时编译html，， 如果您想重新编译它，您可以将$compile服务注入到您的控制器中，并像这样使用它

$compile(element)(scope)

但是，这并不是一种在angular中动态附加元素的正确方法

---

你能告诉我你到底想构建什么吗？？？

angular只在第一次初始化时编译html，， 如果您想重新编译它，您可以将$compile服务注入到您的控制器中，并像这样使用它

$compile(element)(scope)

但是，这并不是一种在angular中动态附加元素的正确方法

---

你能告诉我你到底想构建什么吗？？？

这不是使用angular创建动态HTML的正确方法。在angular中，应该始终使用数据编程，而不要使用DOM编程。除了极端的边缘情况外，很少需要这样使用JQuery，如果需要，建议将其放入指令中，以便重新编译。也许如果你展示了你试图用代码完成的事情，我们可以展示完成任务的角度。@Himmel为什么问题显而易见。angularAggree没有用@Claies编译新的html，无论如何，如果你想继续这种糟糕的做法，你应该告诉angular在向DOM添加新节点后，使用$scope.apply重新编译代码。当然，您应该在angular上下文中这样做。若您真的想学习angular，请尝试停止使用jQuery术语进行思考。理想情况下，完全删除jQuery。@Fcoder确实可以…使用指令侦听滚动事件…然后将更多数据推入数据模型，angular ng repeat负责DOM。这不是使用angular执行动态HTML的正确方法。在angular中，应该始终使用数据编程，而不要使用DOM编程。除了极端的边缘情况外，很少需要这样使用JQuery，如果需要，建议将其放入指令中，以便重新编译。也许如果你展示了你试图用代码完成的事情，我们可以展示完成任务的角度。@Himmel为什么问题显而易见。angularAggree没有用@Claies编译新的html，无论如何，如果你想继续这种糟糕的做法，你应该告诉angular在向DOM添加新节点后，使用$scope.apply重新编译代码。当然，您应该在angular上下文中这样做。若您真的想学习angular，请尝试停止使用jQuery术语进行思考。理想情况下，完全删除jQuery。@Fcoder确实可以…使用指令侦听scroll事件…然后将更多数据推入数据模型，angular ng repeat会处理DOM。这肯定会起作用，并且消除了jQuery调用和对$compile或$scope的需要。$apply，但它仍然是同样糟糕的设计逻辑，只是移动到了一个新位置。它仍然在尝试对DOM进行编程，而不是对数据进行编程。这是一个人为的例子。我会用更合适的方法更新它。这肯定会起作用，并且消除了jquery调用和对$compile或$scope的需要。$apply，但它仍然是同样糟糕的设计逻辑，只是移动到了一个新位置。它仍然在尝试对DOM进行编程，而不是对数据进行编程。这是一个人为的例子。我会用更合适的东西更新它。

function RecordsController() {

     this.records = [ . . . ]; // your records

     this.display = 20; // number of records to display

     var self = this;

     Object.defineProperty(this, 'enableLoadMore', { get: function() {
         return self.records >= self.display;
     }})
}

RecordsController.prototype.showMore = function() {
    this.display += 20;
}

$compile(element)(scope)