Как вы используете $ sce.trustAsHtml (string) для репликации ng-bind-html-unsafe в Angular 1.2+

ng-bind-html-unsafe был удален в Angular 1.2

Я пытаюсь реализовать что-то, где мне нужно использовать ng-bind-html-unsafe . В документах и ​​в деле github они говорят:

ng-bind-html обеспечивает ng-html-bind-небезопасное поведение (innerHTML – результат без дезинфекции), связанный с результатом $ sce.trustAsHtml (string).

Как ты делаешь это?

Которые должны быть:

 

плюс в вашем controllerе:

 $scope.html = '
  • render me please
'; $scope.trustedHtml = $sce.trustAsHtml($scope.html);

вместо старого синтаксиса, где вы можете напрямую $scope.html переменную $scope.html :

 

Как отметили несколько комментаторов, в controller нужно $sce undefined , иначе вы получите $sce undefined ошибку.

  var myApp = angular.module('myApp',[]); myApp.controller('MyController', ['$sce', function($sce) { // ... [your code] }]); 

Фильтр

 app.filter('unsafe', function($sce) { return $sce.trustAsHtml; }); 

Применение

  

Лично я дезинфицирую все свои данные с некоторыми библиотеками PHP, прежде чем переходить в базу данных, поэтому мне не нужен другой фильтр XSS.

Из AngularJS 1.0.8

 directives.directive('ngBindHtmlUnsafe', [function() { return function(scope, element, attr) { element.addClass('ng-binding').data('$binding', attr.ngBindHtmlUnsafe); scope.$watch(attr.ngBindHtmlUnsafe, function ngBindHtmlUnsafeWatchAction(value) { element.html(value || ''); }); } }]); 

Использовать:

 

Чтобы отключить $sce :

 app.config(['$sceProvider', function($sceProvider) { $sceProvider.enabled(false); }]); 

var line = "";

1. использовать фильтр

 app.filter('unsafe', function($sce) { return $sce.trustAsHtml; }); 

используя (html):

  ==>click `aaa` show alert box 

2. использовать ngSanitize: безопаснее

включить angular-sanitize.js

  

добавить ngSanitize в корневое угловое приложение

 var app = angular.module("app", ["ngSanitize"]); 

используя (html):

  ==>click `aaa` nothing happen 

Просто создание фильтра сделает трюк. (Отвечено для Angular 1.6)

 .filter('trustHtml', [ '$sce', function($sce) { return function(value) { return $sce.trustAs('html', value); } } ]); 

И используйте это, как описано в html.

 

Если вы хотите вернуть прежнюю директиву, вы можете добавить это в свое приложение:

Директива:

 directives.directive('ngBindHtmlUnsafe', ['$sce', function($sce){ return { scope: { ngBindHtmlUnsafe: '=', }, template: "
", link: function($scope, iElm, iAttrs, controller) { $scope.updateView = function() { $scope.trustedHtml = $sce.trustAsHtml($scope.ngBindHtmlUnsafe); } $scope.$watch('ngBindHtmlUnsafe', function(newVal, oldVal) { $scope.updateView(newVal); }); } }; }]);

Применение

 

Источник – https://github.com/angular-ui/bootstrap/issues/813

JavaScript

 $scope.get_pre = function(x) { return $sce.trustAsHtml(x); }; 

HTML

 

Для Rails (по крайней мере, в моем случае), если вы используете gem angularjs-rails , не забудьте добавить модуль санитарии

 //= require angular //= require angular-sanitize 

А затем загрузите его в свое приложение …

 var myDummyApp = angular.module('myDummyApp', ['ngSanitize']); 

Затем вы можете сделать следующее:

На шаблоне:

 %span{"ng-bind-html"=>"phone_with_break(x)"} 

И в конце концов:

 $scope.phone_with_break = function (x) { if (x.phone != "") { return x.phone + "
"; } return ''; }
 my helpful code for others(just one aspx to do text area post):: <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication45.WebForm1" %>  enter code here         
Example to show posting valid content to server with two way binding

  • Какой метод следует использовать для ручной загрузки моего AngularJS?
  • Работа с маневрами DOM в AngularJS
  • Как получить доступ к родительской области из пользовательской директивы * с помощью собственной области * в AngularJS?
  • AngularJS: ng-selected не отображает выбранное значение
  • Что такое `priority` директивы ng-repeat, можете ли вы его изменить?
  • AngularJS - как переопределить директиву ngClick
  • Использование углового фильтра в входном элементе
  • AngularJS: фильтр ng-repeat, когда значение больше, чем
  • Когда в пользу ng-if vs. ng-show / ng-hide?
  • AngularJS для цикла с числами и диапазонами
  • Сложность с ng-моделью, ng-repeat и входами
  • Давайте будем гением компьютера.