Question

我有一个很长的哑巴指令使用ngBindTemplate来实现这个目标，但是如果我可以简单地访问表达式中的element.text()，我基本上可以删除该指令。

问题：如何从'element.text()'表达式访问ngBind？

<h1 ng-bind="worldMapCtrl.header.docs.intro || 'element.text()'">ABC</h1>

Answer 1

我做了一个不长的指令，解决了你想要的问题，如果你还想使用指令，请告诉我这是否适合你。

(function(angular) {
  'use strict';

  angular.module('app', [])
  .directive('dumbDirective', [function () {
    return {
      restrict: 'AE',
      scope: {
        htmlInput: '='
      },
      controller: SiteMenuController,
      controllerAs: 'vm',
      bindToController: true,
      templateUrl: 'dumb-directive-template.html'
    };

    function SiteMenuController() {
      this.text = angular.element(this.htmlInput).text();
    }
  }])

  .run(['$templateCache', function($templateCache) {
    $templateCache.put('dumb-directive-template.html',
      '{{ vm.text }}'
    );
  }]);

})(window.angular);

指令用法：

// outputs just 'testing'
<dumb-directive html-input="'<span>testing</span>'"></dumb-directive>

Answer 2

不要以为你可以做到，抱歉！

测试是否无法访问自己的元素。如果你这样做：

<h1 id="test" ng-bind="worldMapCtrl.header.docs.intro || this.$id">ABC</h1>

然后从控制台执行：

angular.element(document.getElementById('test')).scope()

并检查$ id，你会发现它们是相同的。如果你这样做：

angular.element(document.getElementById('test'))

即使ng-bind失败，您也会看到innerHTML是空白的。

你能从ngBind表达式中获取element.text（）吗？

2 个答案: