調用從ES6類方法

角服務（IM使用通天能夠使用ES6）調用從ES6類方法

當我打電話addConfigurationToCart()我得到：

ReferenceError: Order is not defined.

但在構造函數中我不知道。這是爲什麼？我得到了同樣的錯誤，如果我加訂貨作爲參數傳遞給addConfigurationToCart

class ConfigCtrl { 
    constructor($state, api, Order) { 
     this.current = Order.current; 
    } 

    addConfigurationToCart() { 
     Order.saveConfiguration(); 
     $state.go('order'); 
    } 
}

來源

2015-09-14 tobbe

那麼，在構造函數中有一個'訂單'參數，你似乎傳遞了一些東西。你想在你的方法中使用相同的值嗎？請告訴我們你是如何調用這段代碼的。 – Bergi

@bergi訂單是一種角度服務。 Order.saveConfiguration是一個我想從addConfigurationToCart調用的方法。在ng-click上調用addConfigurationToCart – tobbe

constructor和addConfigurationToCart功能有不同的範圍（在JS意義上），並確定，從一個範圍的變量是不是在另一個可用的，除非該變量被分配給任一this屬性或從父範圍可變。

私有變量仍然不存在於ES2015 +中，但有some workarounds這樣做。

最明顯的方法是使用本地變量：

let $state, api, Order; 

class ConfigCtrl { 
    static $inject = ['$state', 'api', 'Order']; 

    constructor(...args) { 
    [$state, api, Order] = [...args]; 
    // ... 
    } 

    addConfigurationToCart() { 
    Order.saveConfiguration(); 
    // ... 
    } 
}

而且更地道的方式，成功地提供類中私有變量：

const [$state, api, Order] = [Symbol(), Symbol(), Symbol()]; 

class ConfigCtrl { 
    static $inject = ['$state', 'api', 'Order']; 

    constructor(...args) { 
    [$state, api, Order].forEach((v, i) => this[v] = args[i]); 
    // ... 
    } 

    addConfigurationToCart() { 
    this[Order].saveConfiguration(); 
    // ... 
    } 
}

來源

2015-09-14 20:57:55 estus

你必須使服務大衆類的其餘部分。

class ConfigCtrl { 
    constructor($state, api, Order) { 
     ... 
     this.Order = Order; 
    } 

    addConfigurationToCart() { 
     this.Order.saveConfiguration(); 
     ... 
    } 
}

來源

2015-09-14 12:52:25

真的沒有更好的方式嗎？那感覺很難看 – tobbe

@tobbe：這對於什麼感覺很醜陋？ – Bergi

它看起來很整潔，但問題在於角控制器並沒有在設計時考慮到類。 ES6控制器廣泛地與控制器一起使用，可以有效地消除$範圍，這感覺很棒。但是現在，'這個'的所有內容都暴露在範圍之內。用服務污染範圍是否太好了？打個招呼碰撞並擰緊封裝。子範圍也會繼承這些工件，但是誰在乎。 – estus

controller: class { 
    constructor($http, Restangular, $state) { 
     Object.assign(this, {$http, Restangular, $state}); 
    } 
    doIt() { 
     // use this.$http, this.Restangular & this.$state freely here 
    } 
}

來源

2016-12-19 10:11:01 alexk

調用從ES6類方法

回答

相關問題