向 AngularJS 中的另一個控制器發送數據

Question

我如何將 array.length 發送到另一個控制器？

第一個控制器：下面的代碼

function uploader_OnAfterAddingFile(item) {

    var doc = {item: {file: item.file}};

    if (doc.item.file.size > 10240) {
        doc.item.file.sizeShort = (Math.round((doc.item.file.size / 1024 / 1024) * 100) / 100) + 'MB';
    } else {
        doc.item.file.sizeShort = (Math.round((doc.item.file.size / 1024) * 100) / 100) + 'KB';
    }
    doc.item.showCancel = true;

    if ($scope.documentStatus) {
        item.formData.push({status: $scope.documentStatus});
    }
    if ($scope.tenderDraftId) {
        item.formData.push({tenderDraftId: $scope.tenderDraftId});
    }

    item.getDoc = function () { return doc; };
    doc.item.getUploadItem = function () { return item; };

    $scope.documents.push(doc);

    //I need send $scope.documents.length
}

發送到其他控制器上的此功能第二個控制器：

它們在一頁上。

首先是Controller，它是一個發布上傳文件的組件。

第二個控制器是一個模態窗口，我們在第一個控制器中輸入了 2 個文本和元素。

我現在只需要它 array.length 在模式窗口的提交功能中上傳的文件。 我試過 $rootScope 但它沒有幫助我。

Answer 1

我認為您在這里真正想做的是$emit或$broadcast一個事件。 這將允許您編寫更少的代碼並能夠毫不費力地將此數據傳遞到您希望的應用程序中的任何位置，使用事件偵聽器$on也將提供相同的效果。

請仔細閱讀本文以了解哪個選項最適合您的用例。 https://medium.com/@shihab1511/communication-between-controllers-in-angularjs-using-broadcast-emit-and-on-6f3ff2b0239d

TLDR： $rootScope.$broadcast 與 $scope.$emit

Answer 2

您可以創建一個自定義服務來存儲和返回您需要的值：請參閱“創建您自己的服務”標題下的更多信息。

或者您可以將 routeParams 注入第二個控制器：查看更多信息

Answer 3

前幾天我遇到了類似的問題。 我會使用數據綁定和 $ctrl 方法。 這是一篇非常好的文章，其中包含一個示例，您可以將其復制到您的用例中：http: //dfsq.info/site/read/angular-components-communication希望這會有所幫助。 這種通信形式使得在同一頁面上的兩個組件之間共享數據變得容易得多。 文章示例：

頭部組件：輸入和輸出

.component('headerComponent', {
   template: `
      <h3>Header component</h3>
      <a ng-class="{'btn-primary': $ctrl.view === 'list'}" ng-click="$ctrl.setView('list')">List</a>
      <a ng-class="{'btn-primary': $ctrl.view === 'table'}" ng-click="$ctrl.setView('table')">Table</a>
   `,
   controller: function( ) {
      this.setView = function(view) {
         this.view = view
         this.onViewChange({$event: {view: view}})
      }
   },
   bindings: {
      view: '<',
      onViewChange: '&'
   }
})

所以這意味着標題組件可以像這樣使用

<header-component view="root.view" on-view-change="root.view = $event.view"></header-component>

主要組成部分：輸入

.component('mainComponent', {
   template: `
      <h4>Main component</h4>
      Main view: {{ $ctrl.view }}
  `,
  bindings: {
     view: '<'
  }
})

父組件

<header-component view="root.view" on-view-change="root.view = $event.view"></header-component>
<main-component view="root.view"></main-component>

當在不同組件中單擊按鈕時，我使用上面解釋的方法在兩個控制器之間傳遞數據以隱藏一個組件。 傳遞的數據是布爾值。 我希望你能用 array.length 做同樣的事情。