ngAttr for boolean attributes

[lanterndev]

I came across #698 again and wonder if the new ngAttr support could help with autofocus if it had special behavior for boolean values. Perhaps something like:

<input type="text" ng-attr-autofocus="{{ value }}">

could cause the autofocus attribute to be added (with a value of value) when value is truthy, and would cause the attribute to be removed when value is falsey (rather than giving it a value of "false").

[pkozlowski-opensource]

@Skivvies Since your use case is handling auto-focus lets focus on this. Going to close this one as duplicate of #2012

[geelen]

I have a use-case that is not related to autofocus. I cannot find anything beyond this here issue which didn't live long. I'm trying to prove Angular can work seamlessly with native Web Components, and am hitting this issue. For several components, boolean attributes make a lot of sense, and as far as I can tell Angular has special directives in place for every one of them. Surely a global directive like ng-attr="{attributeName: truthy}" makes sense in this case - much like ng-class it will only be added if truthy is truthful.

Thoughts?

[caitp]

@geelen what you're asking for is pretty much exactly like #4269 --- however it could also be possible if #8399 lands (but a bit harder using this) --- so Igor didn't want #4269 in the tree, but someone could take that code and publish it as an external module if they wanted

[geelen]

Absolutely true! But neither of those have landed, so until that point I
think this issue should stay open?

On 29 July 2014 23:00, Caitlin Potter notifications@github.com wrote:

@geelen https://github.com/geelen what you're asking for is pretty much
exactly like #4269 #4269 ---
however it could also be possible if #8399
#8399 lands (but a bit harder
using this)

—
Reply to this email directly or view it on GitHub
#2111 (comment).

[caitp]

well #4269 isn't going to land, like I said it's been suggested that someone publish it as an external module, but I don't have the cycles to maintain another module right now, so someone else is welcome to take the code and run with it.

As for the other one, I'm hoping to get that one in either this week or next week, once we decide on a syntax that makes people happy.

[caitp]

this issue was closed ages ago so there isn't much point in re-opening it, but you could always open another one asking for this.

[geelen]

Fair enough. Was hoping there was a way around this with code that's in
core at the moment (was gonna demo something for a conference in a couple
of days), but if it's still in flux I'll hold off.

On 29 July 2014 23:17, Caitlin Potter notifications@github.com wrote:

this issue was closed ages ago so there isn't much point in re-opening it,
but you could always open another one asking for this.

—
Reply to this email directly or view it on GitHub
#2111 (comment).

[franzzua]

you can write a directive like this:

{
  restrict: 'A',
  link: ($scope,$element,$attr) => {
            $scope.$watch($attr.ifAttr, val => {
                Object.keys(val).forEach(key => {
                    if (val[key])
                        $element.attr(key,'');
                    else
                        $element.removeAttr(key);
                });
            });
        };
}

and use it like ngClass or ngStyle: