scope & trigger in angular1

Question

Could you point me to the right direction what I should look up in order to understand the following code about trigger: "=trigger"

app.module.directive('messageModal', function ($compile) {
    return {
        scope: {
            trigger: "=trigger",
        },

        controller: ['$scope', '$element', '$attrs', '$timeout', function ($scope, $element, $attrs, $timeout) {
                $scope.trigger = function(title, message, modal_class, color, auto_hide){

What I understand is that by having scope: {}, the directive 'messageModal'has created a brand new scope object. BUT what does trigger: "=trigger" do? What about the $scope.trigger?

Please I need some directions on what I should learn in order to understand what the directive does. Thanks!

Matías Fidemraizer · Accepted Answer · 2016-07-13 21:44:12Z

2

Properties within scope option are mappings between each property and an attribute in the directive markup when you're using it somewhere.

Scope's property value defines how scope properties are bound:

= means two-way binding
@ means literal binding.
& means function binding.

A scope property can be provided in two ways (with any of above described bindings):

{ some: "=" } which means that scope property and its HTML attribute counterpart will share the same identifier.
{ some: "=whatever" } allows you to define how will be identified the attribute bound to the whole scope property.

Once an isolated scope has already bound properties and attributes, you'll access them injecting $scope and accessing the property: $scope.whatever.

answered Jul 13, 2016 at 21:44

Matías Fidemraizer

65.1k19 gold badges132 silver badges216 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Eugene Kulabuhov · Accepted Answer · 2016-07-13 21:36:00Z

1

There's nothing special about 'trigger', it's just a name of the property you can use to communicate with directive from HTML.

For example, if you use it like this:

<messageModal trigger="whatever here"></messageModal>

Then inside the directive $scope.trigger is going to be equal to "whatever here".

answered Jul 13, 2016 at 21:36

Eugene Kulabuhov

2,5791 gold badge29 silver badges26 bronze badges

Collectives™ on Stack Overflow

scope & trigger in angular1

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related