2014-07-22 3 views
0

a beautiful typewriter directive already written이 있지만 좀 더 간단한 것을 찾고 있는데, 단지 간격을두고 각 문자를 추가하는 것입니다. 나는 이것을 작동시킬 수 없다. 한 번에 텍스트를 모두 보여줍니다. $ timeout에 문제가 있습니다. 누구든지 어떤 제안이 있습니까?각도 - 단순 타자기 효과?

var time = 1000; 
var addLetter = function(i) { 
    $scope.string2 = $scope.string.substr(0, i); 
}; 
for (var i = 0, len = $scope.string.length; i < len; i++) { 
    (function(time) { 
     $timeout(function() { 
      addLetter(i); 
     }, (time + 300)); 
    })(i); 
} 

답변

3

다른 방법이 있습니다.

var content = "contentcontentcontentcontentcontentcontentcontentcontentcontentcontentcontent"; 

$scope.type = ""; 
var i=0; 

var timer = $interval(function(){ 
    if(i<content.length) 
     $scope.type += content[i]; 
     else 
     $interval.cancel(timer); 

    i++; 
    $scope.$apply(); 
}, 100); 

제공 : https://gist.github.com/frozonfreak/8018689

데모 : http://plnkr.co/edit/BILaWVuNpao2zcIInXLl?p=preview

+1

내가 대답 업데이트 . – lucuma

+0

지금 당장 당신을 시험해 보겠습니다. 훨씬 좋네요. – ac360

+1

각도 $ 간격을 사용하고 완료되면이를 취소하기 위해 그것을 업데이트했습니다. – lucuma

0

업데이트 -이, 더 효율적으로 될 수 있는지 확실하지 않습니다 ... 저를 위해 노력하고 있습니다

var time = 0; 
var addLetter = function(i) { 
    $scope.string2 = $scope.string.substr(0, i); 
}; 
for (var i = 0, len = $scope.string.length; i < len + 1; i++) { 
    time = time + 50; 
    (function(time, i) { 
     $timeout(function() { 
      addLetter(i); 
     }, (time)); 
    })(time, i); 
} 
관련 문제