如何從 angularjs 的兩個不同位置調用相同的 function

Question

我有兩個不同的 HTML 文件。 Select 按鈕位於兩個 html 文件中。 如果我單擊該按鈕，我需要 select 卡。

• 我有兩個功能。 第一個默認情況下我需要在屏幕上顯示。

• 第二個是我需要在彈出模式中顯示相同的數據。

  1. 主頁.html

 <button type="button" class="btn btn-primary col-xs-12 col-md-12 col-lg-12"
         ng-click="selectCard()">ADD CARD</button>

2. 頁.html

<button type="button" class="btn btn-primary col-xs-12 col-md-12 col-lg-12" 
        ng-click="selectCard()">ADD CARD</button>

這些都是相同的 html 代碼。

3. 主控制器.js

$scope.selectCard = function () {
    $scope.select = true;               
}

但我的問題是，

頁。 html 文件處於彈出模式。

$scope.view = function () {
    $uibModal.open({
        templateUrl: 'page.html',
        size: 'lg',
        windowClass: 'page',
        controller: function ($scope, $uibModalInstance, $timeout) {          
          $scope.selectCard = function(){             
              $scope.select = true;
          }
        }
    });
}

在彈出模式中，我還需要再次編寫相同的 function 。 然后只有它在工作。

有什么方法可以在兩個地方使用相同的 function。

Answer 1

對於常用功能，服務是最好的地方。 您應該根據控制器中的要求將您的服務添加為依賴注入。

要創建和注入服務，您可以參考這個官方 angularjs 文檔站點： https://docs.angularjs.org/guide/services

Answer 2

您可以將 function 移動到單獨的服務中，並將其注入您需要的所有地方。

如果它應該綁定到mainController.js ，服務 function 可以使用rxJs Subject或只是發出事件來更新mainController.js中的值。