在同一組件的實例之間共享可觀察性

我有一個組件，它是一個下拉菜單（實際上是一個引導按鈕菜單）。 'dropdown'通過對服務器進行AJAX調用並解析JSON字符串來獲取值。在同一組件的實例之間共享可觀察性

我需要在頁面的多個地方這個按鈕，但我需要每次組件的新實例，因爲我必須傳遞調用viewmodel向它添加一些數據。

顯然，每次包含此按鈕時，組件都會執行ajax調用來獲取它的值，這意味着有n個到服務器的AJAX調用。無論如何，我可以只做一個Ajax調用並將其傳播到組件的每個實例？

Button組件

 function AddElement(params) { 
     this.options = ko.observableArray(); 
     var self = this; 
     var section = params.section; 

      $.getJSON("http://localhost:8080/test", function (data) { 
       elementOptions = data; 
       self.options(data); 
      }); 

      this.addElement = function (data) { 
       section.formElements.push(data); 
      }; 

    }

所以，問題是我怎麼能做到這一點，還是有實現這種功能在KO更好的方法（即不是組件）

感謝

大衛

來源

2015-04-02 David Billings

在父組件中執行加載並將數據傳遞給每個子組件。 – CrimsonChris 2015-04-02 15:40:11

讓您的UI層進行數據訪問是個不錯的主意。另一種解決方案是創建一個加載器類，負責執行AJAX調用並可能對其進行緩存。 – CrimsonChris 2015-04-02 15:42:42

將AJAX調用移到AddElement函數之外，並讓它填充本地數組。在AddElement中，從該本地數組複製數據，而不是進行AJAX調用。 – 2015-04-02 15:48:53

選項1：加載你的組件的一些共同的父母，並傳入可觀察數組。

function AddElement(params) { 
    var self = this, 
     section = params.section, 
     options = params.options; 
}

選項2：將加載器對象傳遞給您的組件。

function AddElement(params) { 
    var self = this, 
     section = params.section, 
     loader = params.loader; //All 'AddElement' components get passed the same instance of the loader 

    this.options = ko.observableArray(); 
    loader.load(function (data) { //The loader is responsible for doing the AJAX once and only once. 
     elementOptions = data; 
     self.options(data); 
    }); 
}

來源

2015-04-02 15:48:26 CrimsonChris

在同一組件的實例之間共享可觀察性

回答

相關問題