Filter – Limit the length of string using AngularJS

Filter – Limit the length of string using AngularJS

Today, We want to share with you Filter – Limit the length of string using AngularJS.
In this post we will show you Filter – Limit the length of string using AngularJS, hear for AngularJS – How to Limit String Length using Filter? we will give you demo and example for implement.
In this post, we will learn about Filter – Limit the length of string using AngularJS with an example.

Getting Started for Angularjs limit string length

We have used CDN(libs) for AngularJS so you must need Your internet Data connection for them to work on Filter – Limit the length of string using AngularJS.

Also Read :  Ad Rotate Text Animation Effects using jQuery

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

index.html

This is the main HTML view of our Simple Web Application. In here, we have init Base declared all our simple my this Example(Filter – Limit the length of string using AngularJS) dependencies and the HTML Elements that we have created.

<body ng-app="pakaApp" ng-controller="pakaCtrl">
<h2>AngularJS - How to Limit String Length using Filter?</h2>
{{ randomText | limitChar }}

<hr/>

{{ randomText | limitChar:10 }}

<hr/>

{{ randomText | limitChar:10:"...!!!" }}

</body>

index.js

This contains our simple custom index.js files Add Like as javascript, AngularJS scripts source code.

<script>
var pakaApp = angular.module('pakaApp', []);
pakaApp.controller('pakaCtrl', function($scope) {
    $scope.randomText = "Pakainfo.com is the most popular Programming & Web Development blog. Our mission is to provide the best online resources on programming and web development. We deliver the useful and best tutorials for web professionals — developers, programmers, freelancers and site owners.";
});
pakaApp.filter('limitChar', function () {
    return function (dataContentInfo, length, dtlpka) {
        if (isNaN(length))
            length = 50;
 
        if (dtlpka === undefined)
            dtlpka = "...";
 
        if (dataContentInfo.length <= length || dataContentInfo.length - dtlpka.length <= length) {
            return dataContentInfo;
        }
        else {
            return String(dataContentInfo).substring(0, length-dtlpka.length) + dtlpka;
        }
    };
});
<script>

Full Example : Angularjs filter limit characters

<html>
<head>
<title>AngularJS - How to Limit String Length using Filter?</title>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
</head>
<body ng-app="pakaApp" ng-controller="pakaCtrl">
<h2>AngularJS - How to Limit String Length using Filter?</h2>
{{ randomText | limitChar }}

<hr/>

{{ randomText | limitChar:10 }}

<hr/>

{{ randomText | limitChar:10:"...!!!" }}

<script>
var pakaApp = angular.module('pakaApp', []);
pakaApp.controller('pakaCtrl', function($scope) {
    $scope.randomText = "Any visitors of this site are free to browse our tutorials, live demos and download scripts";
});
pakaApp.filter('limitChar', function () {
    return function (dataContentInfo, length, dtlpka) {
        if (isNaN(length))
            length = 50;
 
        if (dtlpka === undefined)
            dtlpka = "...";
 
        if (dataContentInfo.length <= length || dataContentInfo.length - dtlpka.length <= length) {
            return dataContentInfo;
        }
        else {
            return String(dataContentInfo).substring(0, length-dtlpka.length) + dtlpka;
        }
    };
});
<script>
</body>
</html>

We hope you get an idea about angularjs limit input characters
We would like to have feedback on my Information blog .
Your valuable any feedback, Good question, Inspirational Quotes, or Motivational comments about this article are always welcome.
If you liked this post, Please don’t forget to share this as Well as Like FaceBook Page.

Also Read :  Laravel 5.6 PDF Generation using Dompdf Example

We hope This Post can help you…….Good Luck!.

Recommended For You.

SET Limit length of a string truncate filter with AngularJS
SET Limit length of a string truncate filter with AngularJS In this Post We Will Explain About is SET Limit length