How to increase text font with NgSatinize? [closed]

Navigation
1

I'm not able to increase or decrease the source of my news, which has the NgSatinize attribute, does anyone know how to modify it? or another way to saturate my html?

    
asked by anonymous 20.11.2016 / 18:34

1 answer

1

From what I understand of your question you should be having trouble inserting style inline into the tag within ng-bind . For it to work correctly you should use provider $sce and trustAsHtml function. Here's an example below: 

(function() {
  'use strict';

  angular
    .module('appExemploSanitize', ['ngSanitize']);

  angular
    .module('appExemploSanitize')
    .controller('NoticiaController', NoticiaController);

  NoticiaController.$inject = ['$sce'];

  function NoticiaController($sce) {
    var noticia = this;
    var texto;

    noticia.buscarNoticia = buscarNoticia;
    noticia.aumentarFonte = aumentarFonte;
    noticia.redefinir = redefinir;
    noticia.diminuirFonte = diminuirFonte;

    iniciar();

    function iniciar() {
      noticia.tamanho = 100;
      texto = '<div>O Facebook está tomando uma série de medidas para eliminar boatos e outros tipos de mentiras de seus feeds, disse na sexta-feira (18) o presidente da empresa, Mark Zuckerberg. A rede social enfrenta críticas por não ter evitado uma enxurrada de notícias falsas de serem compartilhadas na rede social antes da eleição norte-americana.</div>';
    }

    function buscarNoticia() {
      return $sce.trustAsHtml('<div style="font-size: ' + noticia.tamanho + '%"' + texto + '</div>');
    }

    function aumentarFonte(quantidade) {
      noticia.tamanho = noticia.tamanho + quantidade;
    }

    function redefinir(novaFonte) {
      noticia.tamanho = novaFonte;
    }

    function diminuirFonte(quantidade) {
      noticia.tamanho = noticia.tamanho - quantidade;
    }
  }
})();
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script><scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/angular-sanitize/1.5.8/angular-sanitize.js"></script>

<div ng-app="appExemploSanitize">
  <div ng-controller="NoticiaController as noticia">
    <div ng-bind-html="noticia.buscarNoticia()">
    </div>
    <br>
    Tamanho: {{noticia.tamanho}}%
    <button ng-click="noticia.aumentarFonte(10)">+</button>
    <button ng-click="noticia.redefinir(100)" ng-disabled="noticia.tamanho === 100">100%</button>
    <button ng-click="noticia.diminuirFonte(10)">-</button>
  </div>
</div>
    
20.11.2016 / 20:46
Problem after applying a patch for random name generation in ffmpeg How do I checkbox asp.net mvc database