如何在服務之間進行雙向通信？

我現在有2個指令：如何在服務之間進行雙向通信？

<div ng-controller="indexViewModel"> 
    <div class="row"> 
     <searchfilters></searchfilters> 
    </div> 
    <div class="row top-buffer"> 
     <searchfields></searchfields> 
    </div> 
</div>

他們都有指定的templateUrl，並調用處理每一個有項目列表2個獨立的服務。

var SearchFiltersService= angular.module('SearchFiltersService', []) 
.service('SearchFilters', function() { 
    this.MyList = []; 
    return this; 
}); 

var SearchFieldsService= angular.module('SearchFieldsService', []) 
.service('SearchFields', function() { 
    this.MyList = []; 
    return this; 
});

我不想提供太多的代碼，因爲我想我可能會錯誤地想到這個問題。我遇到了其他問題的週期性依賴問題。

怎樣纔可以有2個模板，每個都有一個服務，每個服務可以添加和刪除項目（項目作爲其唯一的財產只是一個列表），將在其他服務（以及其他的體現視圖）？

來源

2015-10-19 tic

最佳做法是可能同時擁有您的指令依賴於一個單一的共享服務，而不是兩個獨立但高度相互依存服務。 –

@DanielBeck我嘗試了類似的東西，但服務之間的列表並不完全相同。但是，它們都需要能夠修改彼此的列表。這個實例中的單個共享服務是否應該爲每個共享服務列出兩個列表，並且它們都調用這個服務，這將修改這兩個列表？ – tic

我想，取決於不同但相關的列表的目的，但通常情況下，您希望儘可能減少組件之間的相關性。如果是「添加到列表A的任何東西也應該添加到列表B」，那麼您肯定會希望單個服務管理這兩個列表。 –

由於Daniel Beck的意見，對於如何處理2個服務，需要將數據互相溝通，在這種情況下2只列出了一個很好的答案。下面顯示了可以處理添加項目的共享服務，然後可以實施更多邏輯以根據項目插入到的子服務來更改列表。

var SearchSharedService= angular.module('SearchSharedService', ['SearchFiltersService', 'SearchFieldsService']) 
.service('SearchShared', function (SearchFilters, SearchFields) { 

    this.addFilter = function(filter) { 
     //Perform logic to change filterto desired format for each child service 
     SearchFilters.myList.push(filter); 
     SearchFields.myList.push(filter); 
    }; 

    this.addField = function(field) { 
     //Perform logic to change field to desired format for each child service 
     SearchFilters.myList.push(field); 
     SearchFields.myList.push(field); 
    }; 
    return this; 
}); 

var SearchFiltersService= angular.module('SearchFiltersService', []) 
.service('SearchFilters', function() { 
    this.myList = []; 
    return this; 
}); 

var SearchFieldsService= angular.module('SearchFieldsService', []) 
.service('SearchFields', function() { 
    this.myList = []; 
    return this; 
});

注意：共享服務將需要包括你的模塊在這裏

var app = angular.module('myApp', ['SearchSharedService']);

來源

2015-10-22 19:14:37 tic

如何在服務之間進行雙向通信？

回答

相關問題