[angularjs] कोणीय एनजी-बाइंड-एचटीएमएल और इसके भीतर निर्देश



Answers

महान उत्तर vkammerer के लिए धन्यवाद। संकलन के बाद एक बार ऑप्टिमाइज़ेशन की सिफारिश की जा रही है। घड़ी अभिव्यक्ति के भीतर $ eval प्रदर्शन प्रभाव हो सकता है।

    angular.module('vkApp')
  .directive('compile', ['$compile', function ($compile) {
      return function(scope, element, attrs) {
          var ensureCompileRunsOnce = scope.$watch(
            function(scope) {
               // watch the 'compile' expression for changes
              return scope.$eval(attrs.compile);
            },
            function(value) {
              // when the 'compile' expression changes
              // assign it into the current DOM
              element.html(value);

              // compile the new DOM and link it to the current
              // scope.
              // NOTE: we only compile .childNodes so that
              // we don't get into infinite loop compiling ourselves
              $compile(element.contents())(scope);

              // Use un-watch feature to ensure compilation happens only once.
              ensureCompileRunsOnce();
            }
        );
    };
}]);

यहां एक कांटा और अद्यतन पहेली है।

Question

प्लंकर लिंक

मेरे पास एक तत्व है जिसे मैं इसे HTML से जोड़ना चाहता हूं।

<div ng-bind-html="details" upper></div>

यह काम करता है। अब, इसके साथ ही मेरे पास एक निर्देश भी है जो बाध्य एचटीएमएल से बंधे हैं:

$scope.details = 'Success! <a href="#/details/12" upper>details</a>'

लेकिन div और एंकर के साथ upper निर्देश का मूल्यांकन नहीं होता है। मैं इसे काम करने लायक कैसे बनाऊ?




सबसे अच्छा समाधान जो मैंने पाया है! मैंने इसे कॉपी किया और यह ठीक वैसे ही काम करता है जैसा मुझे चाहिए था। धन्यवाद, धन्यवाद, धन्यवाद ...

निर्देशक लिंक समारोह में मेरे पास है

app.directive('element',function($compile){
  .
  .
     var addXml = function(){
     var el = $compile('<xml-definitions definitions="definitions" />')($scope);
     $scope.renderingElement = el.html();
     }
  .
  .

और निर्देश टेम्पलेट में:

<span compile="renderingElement"></span>



दुर्भाग्य से मेरे पास टिप्पणी करने के लिए पर्याप्त प्रतिष्ठा नहीं है।

मैं उम्र के लिए काम नहीं कर सका। मैंने इस कस्टम निर्देश का उपयोग करने के लिए अपने ng-bind-html कोड को संशोधित किया, लेकिन मैं काम करने के लिए ng-bind-html के लिए आवश्यक $scope.html = $sce.trustAsHtml($scope.html) को हटाने में विफल रहा। जैसे ही मैंने इसे हटा दिया, संकलन समारोह काम करना शुरू कर दिया।




Related