2015-01-22 6 views
5

मैं नीचे के रूप में कई फिल्टर का उपयोग करने की कोशिश कर रहा हूँ,Angularjs में nl2br और linky फ़िल्टर का उपयोग कैसे करें?

<p><span ng-bind-html="someVar | nl2br | linky"></span></p> 

जो कुछ भी बना देता है। हालांकि, जब मैं

<p><span ng-bind-html="someVar | linky | nl2br"></span></p> 

पंक्ति का काम करता है नीचे के रूप में फिल्टर का क्रम बदलने के लिए, लेकिन nl2br लाइन br के लिए टूट जाता है परिवर्तित करने के लिए विफल रहता है। zeroflagL की टिप्पणी पर

.filter('nl2br', function($sce) { 
    return function(input) { 
    return $sce.trustAsHtml(input.replace(/\n/g, '<br>')); 
    } 
} 
+0

यानी उलटे क्रम में इसका उपयोग करने की मूल समस्या का समाधान नहीं करता Nl2br फ़िल्टर के लिए संदर्भ कोड http://pastebin.com/1TsdF0V6 –

+1

'$ sce.trustAsHtml' एक स्ट्रिंग नहीं लौटाता है, 'linky' एक की अपेक्षा करता है। – zeroflagL

+0

मैं इस सवाल को एक बक्षीस के लिए खोल रहा हूं क्योंकि यह एक आम, लेकिन अप्रत्याशित रूप से जटिल समस्या है जो आपको उन चीजों के बारे में सिखाती है जिन्हें आप पहले स्थान पर नहीं जानना चाहते थे। मुझे उपयोगकर्ता द्वारा दर्ज किए गए HTML को अविश्वसनीय रूप से संभालने के लिए महत्वपूर्ण है, लेकिन दो फ़िल्टरों की सरल श्रृंखला के साथ $ sce का उपयोग करने की जटिलता सिर्फ मेरे दिमाग को उड़ाती है। – jsalonen

उत्तर

6

तो मैं करने में सक्षम था इसे someVar | linky | nl2br के साथ काम करें। समस्या लिंकी फ़िल्टर के साथ था। ngSanitize के लिंकी फ़िल्टर क्रमशः \ r और \ n से &#10; और &#13; बदलते हैं। दिया गया nl2br फ़िल्टर उनको पकड़ने में विफल रहता है।

इस सार https://gist.github.com/kensnyder/49136af39457445e5982, nl2br के रूप में संशोधित करने के लिए धन्यवाद इस प्रकार

angular.module('myModule') 
.filter('nl2br', ['$sanitize', function($sanitize) { 
    var tag = (/xhtml/i).test(document.doctype) ? '<br />' : '<br>'; 
    return function(msg) { 
     // ngSanitize's linky filter changes \r and \n to &#10; and &#13; respectively 
     msg = (msg + '').replace(/(\r\n|\n\r|\r|\n|&#10;&#13;|&#13;&#10;|&#10;|&#13;)/g, tag + '$1'); 
     return $sanitize(msg); 
    }; 
}]); 

कार्य बेला http://jsfiddle.net/fxpu89be/4/

हालांकि, यह अभी someVar | nl2br | linky

+0

मुझे स्पष्ट रूप से जिस तरह से आप स्पष्ट समाधान के साथ समस्या है, साथ ही सरल फ़िल्टर प्रदान करते हैं जो वास्तव में काम करता है। बाउंटी से सम्मानित धन्यवाद! – jsalonen

1

बिल्डिंग - अंत तक यह एक सामान्य डंक रखें:

निम्नलिखित कार्यान्वयन nl2br के लिए इस्तेमाल किया जा सकता।

<p><span ng-bind-html="someVar | nl2br | linky | trustMe"></span></p> 

सब विश्वास निकाला जा रहा है - ताकि हम एक सामान्य स्ट्रिंग लौटाने:

.filter('nl2br', function($sce) { 
    return function(input) { 
    return input.replace(/\n/g, '<br>'); 
    } 
} 

आखिरी बात हम क्या करना चाहते हैं कुछ विश्वास जोड़ने है:

.filter('trustMe', function($sce) { 
    return function(input) { 
    return $sce.trustAsHtml(input)); 
    } 
} 
+0

आपके उत्तर के लिए धन्यवाद। इस दृष्टिकोण के साथ दो समस्याएं हैं: सबसे पहले, एक मामूली नोट के रूप में, आपके पास कई वाक्यविन्यास त्रुटियां हैं। दूसरा, यह काम नहीं करता है; भले ही आप '$ sce.trustAsHtml' के माध्यम से आउटपुट चलाते हैं, आप HTML से बच निकले हैं। सबूत के लिए यह पहेली देखें: http://jsfiddle.net/jsalonen/fxpu89be/2/ - यदि आप इन समस्याओं का समाधान करने के लिए आगे बढ़ते हैं तो मुझे आपको बक्षीस देने में खुशी होती है। – jsalonen

संबंधित मुद्दे