在Angular指令中調用Javascript原型，調用函數對自己是undefined

Question

我遇到了一個問題，當我嘗試在Angular上使用Javascript原型調用自己的方法時出現錯誤（未定義不是函數）指示。在使用純Javascript時，我從來沒有遇到過這個問題，所以不知道發生了什麼。

如果我打電話的方法使用Whatever.prototype.whateverFunction()它的工作原理，但是當使用self = this和self.whateverFunction()它給我沒有定義。

任何想法？代碼如下。具體而言，它是不被調用的drawBackground()函數。

感謝

jpDirectives.directive 'falling', -> 


link = ($scope, element, attrs) -> 


    Drop = -> 
     self = this 
     self.init() 


    Drop.prototype = { 
     ctx: {} 
     imgBg: '' 
     x: 0 
     y: 0 
     noOfDrops: 50 
     fallingDrops: [] 
     canvas: {} 
     drop: 0 
     i: 0 


     drawBackground: -> 

      self = this 
      self.ctx.drawImage(self.imgBg, 0, 0) 




     draw: -> 
      self = this 
      console.log 'draw called' 


      self.drawBackground() 


      while self.i < self.noOfDrops 

       self.ctx.drawImage(self.fallingDrops[self.i], self.fallingDrops[self.i].x, self.fallingDrops[self.i].y) 

       self.fallingDrops[self.i].y += self.fallingDrops[self.i].speed #set falling speed 

       if self.fallingDrops[self.i].y > 450 #repeat when out of view 
        self.fallingDrops[self.i].y = -25 
        self.fallingDrops[self.i].x = Math.random() * 600 

       self.i++ 





     init: -> 
      self = this 

      self.canvas = document.getElementById('canvas') 

      if self.canvas.getContext 
       self.ctx = self.canvas.getContext('2d') 
       self.imgBg = new Image() 
       self.imgBg.src = "http://lorempixel.com/600/600" 
       setInterval(self.draw, 36) 



       while self.drop < self.noOfDrops 
        console.log self.noOfDrops 
        fallingDr = new Object() 
        fallingDr["image"] = new Image() 
        fallingDr.image.src = 'http://lorempixel.com/10/10' 

        fallingDr["x"] = Math.random() * 600 

        fallingDr["y"] = Math.random() * 5 

        fallingDr["speed"] = 3 + Math.random() * 5 

        self.fallingDrops.push(fallingDr) 
        self.drop++ 




    } 

    new Drop() 





return { 
    link: link 
} 

Answer 1

我試着翻譯它http://coffeescript.org/到JS和我見下文

link = function(){ 
return new Drop(); 
} 
Drop = function(){ 
    var self = this; 
    return self.init(); 
} 
init = function(){ 
    var _result = []; 
    //and so on 
    while (self.drop < self.noOfDrops){ 
    //and so on 
    result.push(self.drop++) 
    } 
    return _result; 
} 

的東西，如果它是正確的，new Drop()將retrun數組不self。通常new constructer()將隱式返回this沒有return something;可以

init = function(){ 
    var _result = []; 
    //and so on 
    while (self.drop < self.noOfDrops){ 
    //and so on 
    result.push(self.drop++) 
    } 
    return self; 
} 

或

Drop = function(){ 
    var self = this; 
    self.init(); 
    return self; 
}