角$間隔不是一個函數問題

我知道，你很可能將迎來其視爲重複但沒有兄弟主題不解決我的問題，所以這是我簡單的日期倒計時指令：

class Clock { 
    constructor() { 
     this.restrict = 'AC'; 
     this.replace = true; 
     this.template = require('./templates/clock.tpl.html'); 
     this.scope = {}; 
    } 
    link(scope, elem, attrs, $interval) { 
     let end = new Date('05/05/2017 9:00 AM'); 

     let _second = 1000; 
     let _minute = _second * 60; 
     let _hour = _minute * 60; 
     let _day = _hour * 24; 

     scope.showRemaining =() => { 
      let now = new Date(); 
      let distance = end - now; 
      let days = Math.floor(distance/_day); 
      let hours = Math.floor((distance % _day)/_hour); 
      let minutes = Math.floor((distance % _hour)/_minute); 
      let seconds = Math.floor((distance % _minute)/_second); 

      scope.days = days; 
      scope.hours = hours; 
      scope.minutes = minutes; 
      scope.seconds = seconds; 
     } 

     $interval(showRemaining, 1000;) 
    } 
} 

// create factory function to handle DI 
function factory() { 
    "ngInject"; 

    return new Clock(); 
} 

export default factory;

我已經bean搜索這個問題的原因，並且無處不在我得到的信息，間隔函數必須作爲正常的沒有參數或任何其他插件傳遞。但我仍然有同樣的錯誤，那就是：

TypeError: $interval is not a function

有人能幫忙嗎？

來源

2017-02-27 Lukas

通過控制器注入它，而不是鏈接功能 –

你必須注入依賴於你的構造函數，而不是在link功能：

constructor($interval) { 
    // .. 
    this.$interval = $interval; 
} 
link(scope, elem, attrs) { 
    // .. 
    this.$interval(showRemaining, 1000;) 
}

來源

2017-02-27 14:22:29 devqon

upvoted，但我不認爲他在書面方式打字稿 – BiAiB

做葉氏，這不是天經地義的打字稿 – Lukas

的是，同樣的錯誤:( – Lukas

使用類構造指令對象的問題是，指令功能具有非詞彙this（見this answer瞭解更多詳情）。這可能注入$interval到構造，但使用它從link功能也不是沒有可能結合它：

constructor($interval) { 
    ... 
    this.$interval = $interval; 
    this.link = this.link.bind(this); 
}

這表明一個設計問題。指令不適用於類。使用它們來構造指令對象沒有好處。這些類不可重用。他們沒有建築優勢。

Angular 1.5+借鑑了Angular 2的想法（使遷移更容易是當前版本的任務之一），並使開發控制器爲中心。這導致用$onInit和$postLink鉤子替代了前鏈接和後鏈接功能。

的實用的方法，基於類的AngularJS發展可能看起來像：

class ClockController { 
    constructor($interval) { 
    this.$interval = $interval; 
    } 

    $onInit() { 
    this.$interval(() => this.showRemaining(), 1000); 
    } 

    showRemaining() { ... } 
} 

app.directive('clock',() => ({ 
    ... 
    controller: ClockController 
}));

這是有道理的這項指令在這一點上轉換成一個組成部分，因爲這是部件在做什麼。它們基本上是強制執行以控制器爲中心的指令的包裝器。

來源

2017-02-27 16:26:09 estus

角$間隔不是一個函數問題

回答

相關問題