Я хочу иметь директиву, которая форматирует предоставленное значение, которое она отображает, и эта логика форматирования должна быть частью этой директивы, не зависящей от атрибута HTML или родительского контроллера.
Моя упрощенная попытка с единственным атрибутом и тегом выглядит так, но дает TypeError: definition.match is not a function
ошибки.
app.directive('timeSpan', function() {
scope: {
value: '@value',
displayValue: function(v) {
return v / 1000.0;
},
displayUnits: function(v) {
return 'seconds';
},
replace: true,
template: '<span>{{value|displayValue}} {{value|displayUnits}}</span>'
}
}
<time-span value="{{timer}}" />
Моим решением было бы создать контроллер для вашей директивы и объявить ваши функции displayUnits
и displayValue
внутри этого контроллера.
.directive('timeSpan', function() {
return {
scope: {
value: '@value'
},
replace: true,
template: '<span>{{displayValue(value)}} {{displayUnits(value)}}</span>',
controller: 'TimeSpanCtrl',
};
})
.controller('TimeSpanCtrl', ['$scope', function ($scope) {
$scope.displayValue = function(v) {
return v / 1000.0;
};
$scope.displayUnits = function(v) {
return 'seconds';
}
}]);
Аналогичный вопрос в этом посте