无法识别角度JS绑定的HTML函数

Angular JS Bound HTML Functions Not Recognized

本文关键字:绑定 HTML 函数 JS 识别      更新时间:2023-09-26

我正在编写一个应用程序,它可以绘制数据并以表格的形式显示。Angular JS用于排序和分页。我的分页div是使用Angular中的一个函数注入的,该函数构建一个字符串并将其设置为$scope.pagination变量。问题是,当点击注入的HTML中的ng点击函数时,它们不会被识别。我认为这是因为在呈现页面时它们不在那里。

<html ng-app="listingsApp">   
<body ng-controller="pageController" ng-init="type=0">
<div class="pagination" ng-bind-html="paginate"></div>
  var listingsApp = angular.module('listingsApp', []);
  listingsApp.controller('pageController', function($scope, $sce, $filter, $http) {
    $scope.BuildPaginationHtml = function(showPage) {
      pageString = "<span class='"paginationItem '" ng-click='"GoToPage(" + i + ")'"> " + i + " </span>";
      $scope.pagination = pageString;
    }
  }

单击此处的跨度不会转到GoToPage功能。我有一个控制台日志来验证它。页面上的所有其他点击事件都可以工作。

对于动态HTML,您必须使用$compile

listingsApp.controller('pageController', function ($scope, $sce, $filter, $http, $compile) {
    $scope.BuildPaginationHtml = function(showPage) {
        pageString = $compile("<span class='"paginationItem '" ng-click='"GoToPage(" + i + ")'"> " + i + " </span>")($scope);
        $scope.pagination = pageString;
    }
});