Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

ngClass: Add support for conditional map in an array. #4807

Closed
wants to merge 2 commits into from
Closed

ngClass: Add support for conditional map in an array. #4807

wants to merge 2 commits into from

Conversation

@bfanger
Copy link
Contributor

@bfanger bfanger commented Nov 6, 2013

Allows for ng-class expressions, like:

<div ng-class=" [classVar, {'is-active': activeVar }] ">

Which allows a directive to apply classes it got via attributes in conjunction with conditional classes.

{
    scope: {
       classVar: '@myBodyClass'
    }
}

The current situation:
(Assuming classVar is set to "panel" and activeVar is true)

Using a map inside an array sets the class to "panel [Object object]"

Using a map like {classVar: true, 'is-active': activeVar } would set the class to "classVar is-active" instead of the desired "panel is-active"

@petebacondarwin
Copy link
Member

@petebacondarwin petebacondarwin commented Nov 10, 2013

@bfanger - can you ensure that you have signed the CLA?

@bfanger
Copy link
Contributor Author

@bfanger bfanger commented Nov 11, 2013

I've just signed the "Google Individual Contributor License Agreement, v1.1"

@bfanger
Copy link
Contributor Author

@bfanger bfanger commented Jan 22, 2014

Rebased changes on v1.2.9 (makes travis-ci happy)

@bhollis
Copy link

@bhollis bhollis commented May 7, 2014

I was just about to file a feature request for this! Is there something that could be done to make this more amenable to being merged?

@btford btford removed gh: PR labels Aug 20, 2014
@caitp caitp force-pushed the angular:master branch from 591bac5 to d713ad1 Aug 22, 2014
@tbosch tbosch force-pushed the angular:master branch from 6c27b89 to 271572c Aug 30, 2014
@tbosch tbosch force-pushed the angular:master branch from a3d7934 to 1418383 Sep 10, 2014
@petebacondarwin petebacondarwin force-pushed the angular:master branch from 02dc2aa to fd2d6c0 Sep 16, 2014
@jeffbcross jeffbcross force-pushed the angular:master branch 2 times, most recently from cad9560 to f294244 Sep 27, 2014
@btford btford force-pushed the angular:master branch from 9011a65 to 46db47b Oct 6, 2014
@jeffbcross jeffbcross force-pushed the angular:master branch 4 times, most recently from e8dc429 to e83fab9 Oct 8, 2014
@petebacondarwin petebacondarwin force-pushed the angular:master branch from 4dd5a20 to 998c61c Oct 19, 2014
@carlosbaraza
Copy link

@carlosbaraza carlosbaraza commented Mar 16, 2015

Any news on this?

Thank you.

@petebacondarwin
Copy link
Member

@petebacondarwin petebacondarwin commented Mar 16, 2015

@bfanger - OK, this is a reasonable feature. If you can add documentation for it we can try to get it into 1.4 otherwise it will slip to 1.5, I think

@petebacondarwin petebacondarwin modified the milestones: 1.4.x, Backlog, 1.4.0-beta.7 / 1.3.16 Mar 16, 2015
bfanger added 2 commits Nov 6, 2013
Allows for ng-class expressions, like:
<div ng-class=" [classVar, {'is-active': activeVar }] ">
@bfanger
Copy link
Contributor Author

@bfanger bfanger commented Mar 17, 2015

Travis CI failed on 02f8020 (trailing whitespace) which was quickly fixed in 07d2a97

netman92 added a commit to netman92/angular.js that referenced this pull request Aug 8, 2015
This change allows `ngClass` expressions to have both objects and strings
within an array:

```js
$scope.classVar = 'nav-item';
$scope.activeVar = true;
```

```html
<div ng-class=" [classVar, {'is-active': activeVar }] ">
```

In this case, the CSS classes that will be added are: 'nav-item' and 'is-active'.

Closes angular#4807
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Linked issues

Successfully merging this pull request may close these issues.

None yet

6 participants