guy*_*abi 5 angularjs angularjs-directive
我有一个简单的指令
angular.module('myApp')
.directive('myDirective', function () {
return {
template: '<p ng-transclude></p>',
restrict: 'A',
transclude: true,
link: function postLink(scope, element, attrs) {
}
}
}
);
Run Code Online (Sandbox Code Playgroud)
我试图在每次翻译内容更改并呈现指令时运行代码 - 我需要翻译的内容.
我想在这种情况下运行的算法示例是:
我试过scope.$watch多种形式,但无济于事.
Kay*_*ave 11
我们可以在一个监视表达式函数中使用Angular中包含的jqlite来实现这一点.下面是使用jqLite(element.text().length)监视transcluded元素长度的代码.只要附加了该指令的元素的长度发生变化,手表就会触发.
并且新长度传递newValue给手表中的第二个功能(因为我们从第一个手表功能返回它).
myApp.directive('myDirective', function () {
return {
template: '<p ng-transclude></p>',
restrict: 'A',
transclude: true,
replace: true,
link: function (scope, element, attrs) {
scope.$watch(function () {
return element.text().length;
},
function (newValue, oldValue) {
console.log('New Length ', newValue);
});
}
}
});
Run Code Online (Sandbox Code Playgroud)
我在这里有一个工作的jsfiddle:
这解决了单词/字母计数方案.但是element.text()如果你需要它来解决任何变化,你可以自己编写一个测试 - 而不仅仅是长度变化.