कोणीय जेएस सीमा एचटीएमएल टैग

Question

का उपयोग करने के लिए मेरे पास AngularJS में कुछ बाइंडिंग हैं और मैं प्रदर्शित वर्णों की लंबाई को सीमित करना चाहता हूं। यह एक बहुत ही सरल सवाल है जब आपके पास केवल एक साधारण टेक्स्ट सामग्री है।

$scope.text = "<span><h1>Example</h1><p>Special Text</p></span>" 

और भी

$scope.maxNumberOfChar = 10; 

जब मैं निम्न पंक्ति का उपयोग यह खाता HTML टैग को ध्यान में रखकर वर्ण की संख्या की गणना:

हालांकि, मैं पाठ कि HTML टैग शामिल है।

कौन इस समस्या को हल करने और केवल वर्ण की संख्या की गणना, HTML टैग की निकालने के लिए सबसे अच्छा समाधान हो सकता है?

अग्रिम

Answer 1

मैं एक समाधान बना लिया है काम करता है, एक साधारण फिल्टर और regex संचालन के प्रयोग से।

var appFilters = angular.module('myApp.filters', []) 
.filter('limitHtml', function() { 
    return function(text, limit) { 

     var changedString = String(text).replace(/<[^>]+>/gm, ''); 
     var length = changedString.length; 

     return changedString.length > limit ? changedString.substr(0, limit - 1) : changedString; 
    } 
}) 

और संवाददाता के उपयोग, समान limitTo करने के लिए फिल्टर

<span ng-bind-html="text | limitHtml: maxNumberOfChar"></span> 

ध्यान दें कि, इस मामले में मैं भी एक एचटीएमएल बाध्यकारी, मेरे समाधान के विशिष्ट उपयोग कर रहा हूँ।

Answer 2

धन्यवाद यह एक फिल्टर लंबाई पर नहीं आधारित क्यों प्रदर्शित?

बस, एक limitTo फिल्टर

{{ text| limitTo:maxNumberOfChar }} 

Answer 3

केवल गैर एचटीएमएल वर्ण की संख्या की गणना करने के लिए जोड़ने के इस सवाल का जवाब करने के लिए कुछ इसी तरह का उपयोग करें: angularjs to output plain text instead of html

उदाहरण के लिए:

var text = "<span><h1>Example</h1><p>Special Text</p></span>"; 
var length = String(text).replace(/<[^>]+>/gm, '').length; 

alert(length); 

मैंने यहां एक और उदाहरण शामिल किया है: http://jsfiddle.net/n3qjm2u5/

Answer 4

मैं फ़िल्टर बना, तर्क इतना अच्छा नहीं है, लेकिन यह

<span ng-bind-html="text | limitHtml:maxNumberOfChar"></span> 

jsfiddle.net/4x6z283a/1/