i 'm working on project that work with angularJs, and i use Cufon to change fonts. now, when controller loaded, cufon replace angular expressions and after that angularJs will run. that's my problem. i want Cufon run after Angular expression Binding. any one can help me?
in my HTML page:
<span class="input-label" id="lb" >{{s}}</span>
and in js:
$scope.s = "hiiii";
Cufon.replace('#lb', {onAfterReplace: Bifon.convert, fontFamily: 'B Titr'});
problem is where before angular binding happened, Cufon changes expression value.
any one can help me?
You might want to use a directive and listen to the element to be ready:
html:
<div ng-controller="MyController">
<div class="thing" ng-bind="content" cufon-replace-directive>
content {{content}}
</div>
</div>
js:
function MyController($scope) {
$scope.content = [
'param1', 'param2'
];
}
angular.module('myApp', [])
.directive('cufonReplaceDirective', function() {
return function(scope, element, attrs) {
element.ready(function(){
element.html(element.html().replace(/[0-9]/g,"!!!"))
})
};
});
updated for cufon:
function MyController($scope) {
$scope.content = [
'param1', 'param2'
];
}
angular.module('myApp', [])
.directive('cufonReplaceDirective', function() {
return function(scope, element, attrs) {
scope.content = ["somecontent123"]
element.ready(function(){
Cufon.replace('.thing', {onAfterReplace: Bifon.convert, fontFamily: 'B Titr'});
})
};
});