jQuery或jqlite无法处理<ng视图></ng视图>

jQuery or jqlite not working with elements inside <ng-view></ng-view>

本文关键字：ng 视图 gt lt jQuery jqlite 处理      更新时间：2023-09-26

index.html:

<div>
<p class="aaa">ppp</p>
<ng-view>
</ng-view>
</div>

general.html

<p class="bbb">pppppp</p>

javascript

var app = angular.module('StarterApp', ['ngMaterial','ngRoute','ngImgCrop']);
app.config(function($routeProvider){
        $routeProvider
            .when('/general',
                {
                    templateUrl:'../view/general.html'
                })
});
$(document).ready(function() {
    $(".aaa").on("click",function(){
         alert('clicked');
    });
    $(".bbb").on("click",function(){
         alert('clicked');
    });
});

它适用于class="aaa"的元素，但不适用于内的元素

 <ng-view></ng-view>

jQuery代码在控制器之外。

jquery中的

文档就绪可能发生在angular完成加载之前(例如注入ng视图之前(。如果您使用require.js.这样的随需应变脚本系统，则更是如此

因此，你应该

A： 使用Angular的文档就绪版本

angular.element(document).ready(function () {
    $("#aaa").on("click",function(){
     alert('clicked');
    });
    $("#bbb").on("click",function(){
         alert('clicked');
    });
});

B： (角度方式(

为您想要的任何自定义元素、窗体、小部件或正在构建的w/e构建一个角度指令(对其进行分区(，以便您可以处理指令链接或编译函数，然后您可以在其中订阅元素上的事件(如锚点(并访问其事件对象。

相关文章：