What is $event in Angular Material and do I need i

Question

I too find myself looking into this unanswered question but I also find myself wondering if finding an answer matters? I've googled $event and looked through both angular material (well at least the items in the left hand menu of the API docs) and material docs and don't find any reference to it. I've only found a reference to it in the UI Router docs, suggesting it can stop event propagation.

so what is $event? why is it passed into an $mdDialog? do I need it if I'm using ui-router onEnter?

Answer 1

Directly from the docs: $event object is an instance of a jQuery Event Object when jQuery is present or a similar jqLite object.

In the case of angular-material it is used to reference dom event object, for instance a click's event object is used in $mdDialog

Update:

You will have to wrap your state change inside a ng-click event to get the $event object and pass that event object through $state.go():

<div ng-app="myApp" ng-controller="myController">
    <a ng-click="show($event)">add campaign</a>
</div>

And then configure your state:

.state("campaigns.add", {
    url: "/add",
    resolve: {
        event: function($stateParams) {
            return $stateParams.event;
        }
    },
    onEnter: function($mdDialog, $state) {
        var ev = null;

        $mdDialog.show(
        $mdDialog.alert()
            .parent(angular.element(document.body))
            .title('This is an alert title')
            .content('You can specify some description text in here.')
            .ariaLabel('Alert Dialog Demo')
            .ok('Got it!')
            .targetEvent(event)).then(function() {
                $state.go('done');
            });
        }
    })

Here is a working demo based on the code from the other question: http://jsfiddle.net/f30wesj3/2/