कोणीय एचटीएमएल

साथ अंतर्वेशन स्ट्रिंग तो मैं एक "टेम्पलेट स्ट्रिंग" कि इस तरह दिखता है मिल गया है। तो मैंने इस तरह से आगे बढ़े:कोणीय एचटीएमएल

var miniScope = { 
name: "Chuck" 
}; 

var sentence = $interpolate(templateString)(miniScope); 
/* sentence: "Hello my name is Chuck" */

यह काम करता है। अब मैं बोल्ड नाम देना चाहता हूं। मैंने स्पष्ट रूप से कोशिश की है:

var miniScope = { 
name: "<strong>Chuck</strong>" 
};

लेकिन एचटीएमएल कोड से बच निकला। कोई विचार है कि मैं इसे कैसे प्राप्त कर सकता हूं?

पीएस: आप में से उन लोगों के लिए जो आश्चर्य करते हैं कि मैं सिर्फ टेम्पलेट में स्ट्रिंग क्यों नहीं डालता, ऐसा इसलिए है क्योंकि मेरी टेम्पलेट स्ट्रिंग सर्वर से आ रही है।

स्रोत

2014-12-04 MonsieurNinja

स्ट्रिंग से सामान संकलित करने के लिए इस निर्देश का उपयोग करें।

.directive('compile', ['$compile', function ($compile) { 
return function(scope, element, attrs) { 
    scope.$watch(
     function(scope) { 
      return scope.$eval(attrs.compile); 
     }, 
     function(value) { 
      element.html(value); 
      $compile(element.contents())(scope); 
     } 
    ); 
}; 
}]) 


$scope.name = "Vladimir"; 
$scope.str = "Hello my name is <strong>{{name}}</strong>"; 


<div compile="str"></div>

और उपयोग $ SCE भरोसेमंद एचटीएमएल संकलित करने के लिए करता है, तो आप Angular $sce doc

लेकिन इस सामग्री के सभी की जरूरत नहीं कोणीय तरह से वास्तव में, आप कुछ अलग partials उपयोग करने के लिए और साथ निर्देश एनजी-शामिल शामिल करना होगा।

स्रोत

2014-12-04 11:00:27

मैं वास्तव में इसे पूरी तरह से अलग तरीके से कर रहा हूं। यदि यह किसी और की मदद करता है तो मैं पोस्ट छोड़ दूंगा। आपके उत्तर के लिए धन्यवाद – MonsieurNinja

यह Plunkr आउटपुट "हैलो मेरा नाम चक" अपेक्षित है। जावास्क्रिप्ट प्रश्न से अपरिवर्तित है।

var app = angular.module("app", ["ngSanitize"]); 
app.controller("TestCtrl", TestCtrl); 
function TestCtrl($scope, $interpolate) { 
    var templateString = "Hello my name is {{name}}"; 

    var miniScope = { 
    name: "<strong>Chuck</strong>" 
    }; 

    $scope.sentence = $interpolate(templateString)(miniScope); 
}

और अपने HTML में, बनाने का उपयोग आप ng-bind-html का उपयोग एन्कोड किया जा रहा से एचटीएमएल रखने के लिए।

<body ng-controller="TestCtrl"> 
    <div ng-bind-html="sentence"></div> 
    </body>

स्रोत

2015-05-25 04:16:29

'ng-bind-html' angular2 के साथ काम कर रहा है? –

कोणीय एचटीएमएल

उत्तर

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