Join egghead, unlock knowledge.

Want more egghead? It's 45% off for a limited time only!

This lesson is for members. Join us? Get access to all 3,000+ tutorials + a community with expert developers around the world.

Unlock All Content for 45% Off

Already subscribed? Sign In

Save 45% for a limited time.

Get access to all courses and lessons on egghead today.

Autoplay

    Isolate Scope "="

    John LindquistJohn Lindquist

    Perhaps the most useful of the isolate scope binding methods, this episode talks about the use of "=" for two way binding within your directives.

    angularjsAngularJS
    Code

    Code

    Become a Member to view code

    You must be a Member to view code

    Access all courses and lessons, track your progress, gain confidence and expertise.

    Become a Member
    and unlock code for this lesson
    Transcript

    Transcript

    John Lindquist: Now that we've talked about the "@" sign, let's talk about the "=" sign. Let's switch over here and put in "=." You'll see automatically that it's going to break. Basically, you're going to throw errors and everything, because it's not expecting a string any more. It's actually expecting an object to combine to, which would be something like that.

    So, you get rid of the double curlies. It's not an expression any more. If you refresh, you can see that it's actually bound to that Blackberry property there. Now, what this is actually doing, it's setting up a binding both ways. Instead of having just a div here, if I were to set up an input text to ng-model, and then bind this to "flavor," that's going to say that when I update this, also send that change out to here, through here.

    You actually might not be able to see this yet, so let's do this, too. We'll set up another input. This one will be text "ng-model flavor." Then we'll say this one's the controller, and this one's the directive. So, controller and directive and specify update from...so from the controller. Here, this would be from the directive, and that's also sending the updates out to the controller level.

    You can think of the "=" sign as basically being this is set to that, and whatever changes happen, update them. You'll never pass in the double binding in there, because that's just going to send a string like in the "@" sign, it was accepting a string. Here you're going to be sending in a property on a scope to bind to, so that you have the binding happening both ways.

    It looks like that's all about there is to cover on that. I think that's used a lot less than you probably think it is, when you're actually building out directives. Maybe when you're doing little demo things, it might be cool. But I think the "@" sign and the "&" sign to cover next, is used a lot more often than this two-way binding "=" thing.

    Discuss

    Discuss