Получите HTML-элементы с полным календарем вместе с AngularJS и измените их - PullRequest
0 голосов
/ 06 января 2019

Я использую fullcalender и мне нужно поменять некоторые кнопки навигации с AngularJS. У меня нет большого опыта работы с AngularJS, поэтому код JS выглядит примерно так:

var filter = $(".fc-filter-button");
filter.html("<i class='fas fa-filter'></i>");
filter.attr("id", "dropdownFilterButton");

Но как я могу заархивировать эту и некоторые другие обычные задачи JS / JQuery с AngularJS. Я знаю, что тоже могу использовать JQuery, но хочу сделать это правильно, Angular.

Я пробовал что-то вроде этого:

element[0].getElementsByClassName('fc-filter-button').html("<i class='fas fa-filter'></i>")

или

var queryResult = element[0].querySelector('.fc-filter-button');
angular.element(queryResult).html("<i class='fas fa-filter'></i>")

Как я могу внести эти изменения, не касаясь самого кода полной календари.

1 Ответ

0 голосов
/ 06 января 2019

Взгляните на модуль NgSanitize "Модуль ngSanitize предоставляет функции для очистки HTML" .

Вот базовый пример, который должен привести вас в правильном направлении

angular.module('app', ["ngSanitize"])
.controller('myCtrl',function($scope){

$scope.content = "<p>The initial html</p>";

$scope.changeHtml = function(){
  $scope.content = "<h3>The changed html</h3>";
};
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.2/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.2/angular-sanitize.min.js"></script>

<div ng-app="app" ng-controller="myCtrl">

<button ng-click="changeHtml()">Change html</button>
<div ng-bind-html="content">
</div>

</div>
...