added 5 characters in body

Source Link

edited Apr 16, 2020 at 8:10

8.4k
4
46
47

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

And here are some relevant snippets:

From the HTMLHTML:

  <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?

I found another fiddle that shows the expression solution too: http://jsfiddle.net/maxisam/QrCXh/

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?

I found another fiddle that shows the expression solution too: http://jsfiddle.net/maxisam/QrCXh/

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 expression and to the parent scope", but that seems to work fine with bidirectional binding too. Why would the expression route be better?

I found another fiddle that shows the expression solution too: http://jsfiddle.net/maxisam/QrCXh/

added a new tag

Link

edit approved Mar 6, 2017 at 11:24

Pooja Kedar

437
2
10
23

Copy edited (e.g. ref. <http://en.wikipedia.org/wiki/HTML>).

Source Link

edited Jul 9, 2016 at 14:15

Peter Mortensen

31.4k
22
110
134

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

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:

fromFrom the htmlHTML:

  <pane bi-title="title" title="{{title}}">{{text}}</pane>

fromFrom the pane directive:

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

There are several things I don't get:

whyWhy do I have to use "{{title}}" with '@' and "title" with '='?
canCan 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?

I found another fiddle that shows the expression solution too: http://jsfiddle.net/maxisam/QrCXh/

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

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?

I found another fiddle that shows the expression solution too: http://jsfiddle.net/maxisam/QrCXh/

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

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?

I found another fiddle that shows the expression solution too: http://jsfiddle.net/maxisam/QrCXh/