feat($compile): support expansion of special `ngBindon` attributes #15464

dcherman · 2016-12-02T18:21:59Z

What kind of change does this PR introduce? (Bug fix, feature, docs update, ...)

feat

What is the current behavior? (You can also link to an open issue here)

Supporting unidirectional data-flow is rather verbose

What is the new behavior (if this is a feature change)?

Supporting unidirectional data-flow is less verbose

Does this PR introduce a breaking change?

Nope

Please check if the PR fulfills these requirements

The commit message follows our guidelines: https://github.com/angular/angular.js/blob/master/CONTRIBUTING.md#commit-message-format
Tests for the changes have been added (for bug fixes / features)
Docs have been added / updated (for bug fixes / features)

In order to reduce some of the verbosity associated with conforming to the
ideas behind unidirectional data-flow, we can introduce a special
attribute syntax that will be automatically expanded in order to simulate
two-way data binding.

For example,

<my-component ng-bindon-foo="bar"> will be expanded into
<my-component foo="bar" foo-changed="bar = $event">

Fixes #15455

googlebot · 2016-12-02T18:22:01Z

Thanks for your pull request. It looks like this may be your first contribution to a Google open source project. Before we can look at your pull request, you'll need to sign a Contributor License Agreement (CLA).

📝 Please visit https://cla.developers.google.com/ to sign.

Once you've signed, please reply here (e.g. I signed it!) and we'll verify. Thanks.

If you've already signed a CLA, it's possible we don't have your GitHub username or you're using a different email address. Check your existing CLA data and verify that your email is set on your git commits.
If you signed the CLA as a corporation, please let us know the company's name.

googlebot · 2016-12-02T18:22:01Z

Thanks for your pull request. It looks like this may be your first contribution to a Google open source project. Before we can look at your pull request, you'll need to sign a Contributor License Agreement (CLA).

📝 Please visit https://cla.developers.google.com/ to sign.

Once you've signed, please reply here (e.g. I signed it!) and we'll verify. Thanks.

If you've already signed a CLA, it's possible we don't have your GitHub username or you're using a different email address. Check your existing CLA data and verify that your email is set on your git commits.
If you signed the CLA as a corporation, please let us know the company's name.

googlebot · 2016-12-02T18:23:58Z

CLAs look good, thanks!

googlebot · 2016-12-02T18:23:58Z

CLAs look good, thanks!

dcherman · 2016-12-02T18:25:02Z

This PR is intended mainly to serve as a proof of concept and start a discussion around whether or not we like this implementation and also, the actual name of the attribute prefix we'd like to use.

Will work on documentation and additional tests shortly assuming we like it.

gkalpak

I like ng-bindon- better, because it matches ng2's bindon- pretty closely (but maybe it is too close).

gkalpak · 2016-12-02T22:02:04Z

src/ng/compile.js

@@ -1803,7 +1803,7 @@ function $CompileProvider($provide, $$sanitizeUriProvider) {
            : function denormalizeTemplate(template) {
              return template.replace(/\{\{/g, startSymbol).replace(/}}/g, endSymbol);
        },
-        NG_ATTR_BINDING = /^ngAttr[A-Z]/;
+        NG_ATTR_BINDING = /^ng(Attr|Autobind)[A-Z]/;


The name of the variable needs to change.

gkalpak · 2016-12-02T22:05:50Z

test/ng/compileSpec.js

@@ -11441,6 +11441,40 @@ describe('$compile', function() {
    });
  });

+  describe('ngAutobind attributes', function() {
+    it('should expand `ng-autobind-foo` to a one-way binding and an output expression', function() {


The one-way part is not accurate.

gkalpak · 2016-12-02T22:07:11Z

test/ng/compileSpec.js

+            fooChange: '&'
+          },
+          controller: function($attrs) {
+            testController = this;


We usually use element.controller('test') for accessing the controller. It is a good idea to keep the consistency.

dcherman · 2016-12-02T22:28:09Z

Ah, I forgot that ng2 even had bindon since I was used to the shorthand syntax. That explains the suggestion.

Anyway, everything should be fixed up.

In order to reduce some of the verbosity associated with conforming to the ideas behind unidirectional data-flow, we can introduce a special attribute syntax that will be automatically expanded in order to simulate two-way data binding. For example, `<my-component ng-bindon-foo="bar">` will be expanded into `<my-component foo="bar" foo-change="bar=$event">` Fixes angular#15455

dcherman · 2016-12-12T17:22:45Z

Any update here? Was hopeful that this would make it to 1.6, but would love it if it could be considered for the next release (and maybe a patch to 1.5? ❤️ )

gkalpak · 2016-12-13T10:53:49Z

This can still land on 1.6. Since it is not a breaking change, it didn't have to make it into 1.6.0.
Let's discuss this next week.

dcherman · 2017-01-11T17:17:03Z

Any update here?

gkalpak · 2017-01-11T18:10:15Z

Let's discuss this next week. _{(This weeks meeting was too busy 😁)}

dcherman · 2017-03-04T15:56:54Z

For anyone that's been waiting for this, I've written a polyfill that can be used to detect and add support for this feature. It does depend on implementation details and some assumptions since there's no other way to do it, and it does have the cost of extra iterations of the attributes object.

https://gist.github.com/dcherman/57621dd904cf598f12b81ae6e0f4b6b2

googlebot added the cla: no label Dec 2, 2016

dcherman force-pushed the ngBanana branch from c8c2389 to afc1fe4 Compare December 2, 2016 18:23

googlebot added cla: yes and removed cla: no labels Dec 2, 2016

dcherman force-pushed the ngBanana branch from afc1fe4 to b4e4627 Compare December 2, 2016 18:26

gkalpak added component: $compile needs: feedback severity: inconvenient type: feature labels Dec 2, 2016

gkalpak added this to the Backlog milestone Dec 2, 2016

gkalpak reviewed Dec 2, 2016

View reviewed changes

dcherman force-pushed the ngBanana branch 2 times, most recently from 50c01bf to 15617cf Compare December 2, 2016 22:28

dcherman force-pushed the ngBanana branch 2 times, most recently from a8767ec to 159221a Compare December 2, 2016 22:30

dcherman force-pushed the ngBanana branch from 159221a to fad5869 Compare December 3, 2016 20:09

dcherman changed the title ~~WIP: feat($compile): support expansion of special ngAutobind attributes~~ feat($compile): support expansion of special ngBindon attributes Dec 3, 2016

gkalpak mentioned this pull request Jun 1, 2018

Request full support for the Web Components Custom Elements spec in version 1.7 #16428

Closed

3 tasks

dcherman closed this Jun 4, 2020

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat($compile): support expansion of special `ngBindon` attributes #15464

feat($compile): support expansion of special `ngBindon` attributes #15464

dcherman commented Dec 2, 2016 •

edited

Loading

googlebot commented Dec 2, 2016

googlebot commented Dec 2, 2016

googlebot commented Dec 2, 2016

googlebot commented Dec 2, 2016

dcherman commented Dec 2, 2016

gkalpak left a comment

gkalpak Dec 2, 2016

gkalpak Dec 2, 2016

gkalpak Dec 2, 2016

dcherman commented Dec 2, 2016

dcherman commented Dec 12, 2016

gkalpak commented Dec 13, 2016

dcherman commented Jan 11, 2017

gkalpak commented Jan 11, 2017

dcherman commented Mar 4, 2017

feat($compile): support expansion of special ngBindon attributes #15464

feat($compile): support expansion of special ngBindon attributes #15464

Conversation

dcherman commented Dec 2, 2016 • edited Loading

googlebot commented Dec 2, 2016

googlebot commented Dec 2, 2016

googlebot commented Dec 2, 2016

googlebot commented Dec 2, 2016

dcherman commented Dec 2, 2016

gkalpak left a comment

Choose a reason for hiding this comment

gkalpak Dec 2, 2016

Choose a reason for hiding this comment

gkalpak Dec 2, 2016

Choose a reason for hiding this comment

gkalpak Dec 2, 2016

Choose a reason for hiding this comment

dcherman commented Dec 2, 2016

dcherman commented Dec 12, 2016

gkalpak commented Dec 13, 2016

dcherman commented Jan 11, 2017

gkalpak commented Jan 11, 2017

dcherman commented Mar 4, 2017

feat($compile): support expansion of special `ngBindon` attributes #15464

feat($compile): support expansion of special `ngBindon` attributes #15464

dcherman commented Dec 2, 2016 •

edited

Loading