I have a big long dumb directive using ngBindTemplate
to accomplish this but if I could simply access the element.text()
inside the expression I could essentially remove the directive.
我有一个很长的哑指令使用ngBindTemplate来完成这个,但如果我可以简单地访问表达式中的element.text(),我基本上可以删除该指令。
Question: How do I access 'element.text()'
from the ngBind
expression?
问题:如何从ngBind表达式访问'element.text()'?
<h1 ng-bind="worldMapCtrl.header.docs.intro || 'element.text()'">ABC</h1>
2 个解决方案
#1
0
Don't think you can do it, sorry!
不要以为你能做到,对不起!
Did a test an was unable to access the element it self. If you do:
测试是否无法访问自己的元素。如果你这样做:
<h1 id="test" ng-bind="worldMapCtrl.header.docs.intro || this.$id">ABC</h1>
And then from the console do:
然后从控制台做:
angular.element(document.getElementById('test')).scope()
And check the $id you will see that they are the same. Also if you do:
并检查$ id,你会发现它们是相同的。如果你这样做:
angular.element(document.getElementById('test'))
You will see that the innerHTML is blank even if the ng-bind failed.
即使ng-bind失败,您也会看到innerHTML是空白的。
#2
0
I made a not that long directive, that solves what you want, in case you still want to use a directive, let me know if this work for you.
我做了一个不那么长的指令,解决了你想要的,如果你还想使用指令,让我知道这是否适合你。
(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);
Directive usage:
// outputs just 'testing'
<dumb-directive html-input="'<span>testing</span>'"></dumb-directive>
#1
0
Don't think you can do it, sorry!
不要以为你能做到,对不起!
Did a test an was unable to access the element it self. If you do:
测试是否无法访问自己的元素。如果你这样做:
<h1 id="test" ng-bind="worldMapCtrl.header.docs.intro || this.$id">ABC</h1>
And then from the console do:
然后从控制台做:
angular.element(document.getElementById('test')).scope()
And check the $id you will see that they are the same. Also if you do:
并检查$ id,你会发现它们是相同的。如果你这样做:
angular.element(document.getElementById('test'))
You will see that the innerHTML is blank even if the ng-bind failed.
即使ng-bind失败,您也会看到innerHTML是空白的。
#2
0
I made a not that long directive, that solves what you want, in case you still want to use a directive, let me know if this work for you.
我做了一个不那么长的指令,解决了你想要的,如果你还想使用指令,让我知道这是否适合你。
(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);
Directive usage:
// outputs just 'testing'
<dumb-directive html-input="'<span>testing</span>'"></dumb-directive>