How to change text in div by angularJS?

Question

js code:

myEl = angular.element(document.querySelector('#divData'));
myEl.text('This is text.');

this way I can change the text of #divData element. But I want to add some html code like, <b>This is a bold text</b>. But It's getting rendered as it is. But I want output as This is a bold text. Please provide me a solution through only angularJS.

Answer 1

Please check the documentation: https://docs.angularjs.org/api/ng/directive/ngBindHtml

Answer 2

Try with

myEl.html('This is text.');

instead of text

Answer 3

Just add html tags to text apparently not works well. I believe thats its to only add 'text' not elements. Maybe I'm doing something wrong.

Follows plunker. With two cases. One of official documentation and other with answers posted here.

(function(angular) {
 'use strict';
  angular.module('bindHtmlExample', ['ngSanitize'])
  .controller('ExampleController', ['$scope', function($scope) {

$scope.myHTML =
   'I am an <code>HTML</code>string with ' +
   '<a href="#">links!</a> and other <em>stuff</em>';

$scope.executar = function(){
  var myEl = angular.element(document.querySelector('#divData'));
  myEl.text('<b>This is a bold text</b>');
};
  }]);
})(window.angular);

https://plnkr.co/edit/1Hnb018XstMYfynr34nJ?p=preview

Advice of Sebastian Sebald its good. Go ahead documentation. I also did not know until five minutes ago. I just learn now.

Answer 4

use .html if you want to assign html.

myEl.html('<b>This is a bold text</b>');