Menu
How can I limit number of characters for ng-bind-html result in angularJS? Is it possible?
For example there is <span>some text </span> in js file and with $sce and ng-bind-html transform to html.
I want to show som... How can I limit it?
307
The ng-bind-html directive is a secure way of binding content to an HTML element. When you are letting AngularJS write HTML in your application, you should check the HTML for dangerous code. By including the "angular-sanitize.
ng-bind directive binds the AngularJS Application data to HTML tags. ng-bind updates the model created by ng-model directive to be displayed in the html tag whenever user input something in the control or updates the html control's data when model data is updated by controller.
ngModel usually use for input tags for bind a variable that we can change variable from controller and html page but ngBind use for display a variable in html page and we can change variable just from controller and html just show variable. Save this answer.
firstName expression in the application's scope are also reflected instantly in the DOM by Angular. ng-bind is about twice as fast as {{}} expression bind. ng-bind places a watcher on the passed expression and therefore the ng-bind only applies, when the passed value actually changes.
AngularJS limitTo using HTML tags
@Sericaia had a great answer
She creates a custom filter like so:
angular.module('limitHtml', [])
.filter('limitHtml', function() {
return function(text, limit) {
var changedString = String(text).replace(/<[^>]+>/gm, '');
var length = changedString.length;
return length > limit ? changedString.substr(0, limit - 1) : changedString;
}
});
And then utilizes it in the view:
<span ng-bind-html="text | limitHtml: maxNumberOfChar"></span>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
