從控制器的自定義指令更新值

Question

我似乎無法得到這個工作。我是angularjs的新手，我正在將現有的Web應用程序轉換爲使用angularjs。 我看了四周，我似乎無法找到答案。

這是主要的HTML：

<div> 
    <custom-header form-object="mainCtrl.form"></custom-header> 
    <custom-sidebar form-object="mainCtrl.form"></custom-sidebar> 
    <custom-subheader form-object="mainCtrl.form"></custom-subheader> 
    <ui-view id="ng_subview"></ui-view> 
</div> 

正如你所看到的，我有一個自定義的指令，一個主入口，並在自定義側邊欄選擇鏈接或使用時注入的內容的用戶界面視圖標籤瀏覽器的網址搜索欄。

我的app.config文件包含路由配置。

$stateProvider 
.state("parent", { 
    url: "", //omitted 
    template: "main.html", 
    controller: "mainController", 
    controllerAs: "mainCtrl", 
    abstract: true, 
    resolved: {} // omitted 
}) 
.state("parent.customer_questions", { 
    url: "", //omitted 
    template: "customer_questions.html", 
    controller: "customerQuestionController", 
    controllerAs: "customerQestionCtrl", 
}) 

主控制器：

function(factory, $stateParams){ 
    let self = this; 
    // Http request 
    self.form = factory.getData($stateParams.id).then(function(results){ 
    return results; 
    }); 
} 

問題控制器：

function(customerQuestionsFactory, $stateParams, $filter, data, $scope){ 
    let self = this; 

    self.customerQuestions = { 
     questions: [], 
     sendReply: function(index, conversation_id){ 
      /* 
      When I call the method it updates the content of the 
      customer question view, and it is working correctly. 
      However, the custom sidebar directive keeps track of 
      the total of new questions, but the sidebar doesn't update. 
      I have tried: 
      $parent in this case is the mainCtrl 
      $scope.$parent.new_question_total = 100 // this does not work. 
      */ 
     } 
    } 
} 

邊欄指令：

function($location){ 
    return { 

     restrict: 'E', 
     templateUrl: 'custom_sidebar.html', 
     replace: true, 
     scope: { 
     formObject: "=" 
     }, 
     link: function($scope, element, attrs) { 
      //code omitted 
     } 
    } 
} 

側邊欄HTML：

<!-- 
    This is where I'm setting the value. 
--> 
<a ng-click="" ui-sref="" ng-bind="formObject.new_question_total"></a> 

我需要更新側邊欄視圖「formObject.new_question_total」中的值。

這是場景： 當我導航到客戶問題視圖時，會有一個表單更新客戶問題，並更新內容區域。在這個頁面上，它記錄了有多少新問題。顯然，更新時，新的符號消失。 在邊欄上，有一個鏈接導航到客戶問題頁面，並帶有大量新問題。如果我更新客戶視圖，這個數字應該減少。 據我所知，第一次加載頁面時，指令中的鏈接函數只被調用一個。

1. 有沒有辦法從客戶問題 控制器調用鏈接方法？
2. 我有什麼選擇可以做到這一點？
3. 有沒有更好的方法來做到這一點，而不是調用鏈接方法？

我不確定您是否需要更多信息，但如果您需要更多信息，我將很樂意添加更多信息。 我曾嘗試使用$ apply，$ watch，$ broadcast，在線查看，但沒有運氣。

在此先感謝！

Answer 1

使用$ rootScope。$ boradcast

function(customerQuestionsController, $stateParams, $filter, data, $scope, $rootScope){ 
    let self = this; 

    self.customerQuestions = { 
     questions: [], 
     sendReply: function(index, conversation_id){ 
      $rootScope.$broadcast('questionUpdate',index) 
     } 
    } 
} 

在指令

function($location, $rootScope){ 
    return { 

     restrict: 'E', 
     templateUrl: 'custom_sidebar.html', 
     replace: true, 
     scope: { 
     formObject: "=" 
     }, 
     link: function($scope, element, attrs) { 
      $rootScope.$on("questionUpdate", function(event, data){ 
       //do something 
      }); 
     } 
    } 
}