首頁猿問角ng-綁定-html及其內的指令

角ng-綁定-html及其內的指令

AngularJS

繁花不似錦 2019-07-05 14:34:16

角ng-綁定-html及其內的指令柱塞連桿我有一個元素，我想將html綁定到它。<div ng-bind-html="details" upper></div>這很管用?，F在，除了它，我還有一個綁定到綁定html的指令：$scope.details = 'Success! <a href="#/details/12" upper>details</a>'但指令upper對DIV和錨不要進行評估。我該怎么做呢？

查看完整描述

3 回答

慕哥6287543

TA貢獻1831條經驗獲得超10個贊

我也面臨著這個問題，在網上搜索了幾個小時后，我看到了@Chandermani的評論，這被證明是解決問題的方法。您需要用以下模式調用一個“編譯”指令：

HTML：

<div compile="details"></div>

聯(lián)署材料：

.directive('compile', ['$compile', function ($compile) {
    return function(scope, element, attrs) {
        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);
            }
        );
    };}])

你可以看到這里的小提琴

反對回復 2019-07-05

慕姐4208626

TA貢獻1852條經驗獲得超7個贊

謝謝你的回答。我建議的一個優(yōu)化是在編譯運行一次之后不進行監(jiān)視。Watch表達式中的$val可能會對性能產生影響。

    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();
            }
        );
    };}]);

這是一把叉子和更新的小提琴。

反對回復 2019-07-05