AngularJS 事件 與 的使用方式

Posted on | Edited on | In

用途：跨 Controller 傳遞變數

Broadcast

用於事件發送 

1
$scope.$broadcast

On

用於接收事件 

1
$scope.$on

範例

1
2
3
4
5
6
7
8
9
10
11
12
13
14
app = angular.module('TestApp', []);
// 發送的 controller
app.controller('ctl', function($scope) {
    var myData = '123';
    $scope.$broadcast('EventName', myData);
});
// 接收的 controller
app.controller('ctl2', funciton($scope) {
    $scope.$on('EventName', function(event, args) {
        console.warn(args); // equals to '123'
    });
});

程式說明

  1. 宣告 app 為 angular 的 model
  2. 宣告兩個 controller 分別為 ctl 跟 ctl2
  3. 然後我希望可以將 ctl 的變數傳到 ctl2 這個 controller 下面
  4. EventName 可以自定成不同的事件名稱