Categories

See More
Popular Forum

MBA (4887) B.Tech (1769) Engineering (1486) Class 12 (1030) Study Abroad (1004) Computer Science and Engineering (988) Business Management Studies (865) BBA (846) Diploma (746) CAT (651) B.Com (648) B.Sc (643) JEE Mains (618) Mechanical Engineering (574) Exam (525) India (462) Career (452) All Time Q&A (439) Mass Communication (427) BCA (417) Science (384) Computers & IT (Non-Engg) (383) Medicine & Health Sciences (381) Hotel Management (373) Civil Engineering (353) MCA (349) Tuteehub Top Questions (348) Distance (340) Colleges in India (334)
See More
( 8 months ago )

What is the difference between '@' and '=' in directive scope in AngularJS?

General Tech Bugs & Fixes
Max. 2000 characters
Replies

usr_profile.png
Nageshwer Reddy

User

( 8 months ago )

The = means bi-directional binding, so a reference to a variable to the parent scope. This means, when you change the variable in the directive, it will be changed in the parent scope as well.

@ means the variable will be copied (cloned) into the directive.

As far as I know, <pane bi-title="{{title}}" title="{{title}}">{{text}}</pane> should work too. bi-title will receive the parent scope variable value, which can be changed in the directive.

If you need to change several variables in the parent scope, you could execute a function on the parent scope from within the directive (or pass data via a service).

usr_profile.png
Arminder Gill

User

( 8 months ago )

I've read the AngularJS documentation on the topic carefully, and then fiddled around with a directive. Here's the fiddle.

And here are some relevant snippets:

  • From the HTML:

    <pane bi-title="title" title="{{title}}">{{text}}</pane>
  • From the pane directive:

    scope: { biTitle: '=', title: '@', bar: '=' },

There are several things I don't get:

  • Why do I have to use "{{title}}" with '@' and "title" with '='?
  • Can I also access the parent scope directly, without decorating my element with an attribute?
  • The documentation says "Often it's desirable to pass data from the isolated scope via an expression and to the parent scope", but that seems to work fine with bidirectional binding too. Why would the expression route be better?

what's your interest


forum_ban8_5d8c5fd7cf6f7.gif