-
Notifications
You must be signed in to change notification settings - Fork 773
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
fix(ngStyle, ngClass): StyleDirective security fixes & merge activated styles #198
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
ThomasBurleson
force-pushed
the
fix/issue_197
branch
3 times, most recently
from
February 25, 2017 22:31
9fe217f
to
7207c0d
Compare
ThomasBurleson
changed the title
fix(style): StyleDirective should merge styles instead of overwriting all existing
fix(ngStyle, ngClass): style directive should merge styles instead of overwriting all existing
Feb 25, 2017
ThomasBurleson
force-pushed
the
fix/issue_197
branch
2 times, most recently
from
February 25, 2017 22:36
71b2007
to
ae35afa
Compare
ThomasBurleson
force-pushed
the
fix/issue_197
branch
5 times, most recently
from
February 26, 2017 23:05
b7d0402
to
340e42d
Compare
ThomasBurleson
changed the title
fix(ngStyle, ngClass): style directive should merge styles instead of overwriting all existing
fix(ngStyle, ngClass): StyleDirective security fixes & merge activated styles
Feb 26, 2017
ThomasBurleson
force-pushed
the
fix/issue_197
branch
11 times, most recently
from
February 27, 2017 15:01
121cb7a
to
d2715e4
Compare
…d styles * Add use of **DomSanitizer** + **SecurityContext.STYLE** to safeguard all style values * Deprecated use of `style` selectors to favor `ngStyle` selectors since the functionality extends **NgStyle** directive. * Deprecated use of `class` selectors to favor `ngClass` selectors since the functionality extends **NgClass** directive. * `ngStyle` restores default (non-activated) inline styles when breakpoint deactivates * `ngStyle` merges default inline styles with activated styles * `ngStyle` selectors support Object notations or raw strings (ala html inline styles) * e.g. Object notation = `[ngStyle]="{'font-size.px': 10, color: 'rgb(0,0,0)', 'text-align':'left'}"` * e.g. Raw-string notation = `style="font-size:10px; color:black; text-align:left;"` * NOTE: delimiters for raw-strings must be `;`. * Add support to ngStyle for all **NgStyleType** type variations * Added `style-transforms.ts` utilities and tests * Refactored `_buildStyleMap()` method BREAKING CHANGE: * `[style.<alias>]` selectors are deprecated in favor of `[ngStyle.<alias>]` selectors * `[class.<alias>]` selectors are deprecated in favor of `[ngClass.<alias>]` selectors * default styles are merged with activated styles ```html <div fxLayout [class.xs]="['xs-1', 'xs-2']" [style]="{'font-size': '10px', 'margin-left' : '13px'}" [style.xs]="{'font-size': '16px'}" [style.md]="{'font-size': '12px'}"> </div> ``` ```html <div fxLayout [ngClass.xs]="['xs-1', 'xs-2']" [ngStyle]="{'font-size': '10px', 'margin-left' : '13px'}" [ngStyle.xs]="{'font-size': '16px'}" [ngStyle.md]="{'font-size': '12px'}"> </div> ``` Fixes #197.
ThomasBurleson
force-pushed
the
fix/issue_197
branch
from
February 27, 2017 15:12
d2715e4
to
7f2715c
Compare
kara
added
pr: merge ready
This PR is ready for the caretaker to presubmit and merge
and removed
pr: needs presubmit
labels
Feb 27, 2017
karlhaas
pushed a commit
to karlhaas/flex-layout
that referenced
this pull request
May 3, 2017
…d styles (angular#198) BREAKING CHANGE: * `[style.<alias>]` selectors are deprecated in favor of `[ngStyle.<alias>]` selectors * `[class.<alias>]` selectors are deprecated in favor of `[ngClass.<alias>]` selectors * default styles are merged with activated styles ```html <div fxLayout [class.xs]="['xs-1', 'xs-2']" [style]="{'font-size': '10px', 'margin-left' : '13px'}" [style.xs]="{'font-size': '16px'}" [style.md]="{'font-size': '12px'}"> </div> ``` ```html <div fxLayout [ngClass.xs]="['xs-1', 'xs-2']" [ngStyle]="{'font-size': '10px', 'margin-left' : '13px'}" [ngStyle.xs]="{'font-size': '16px'}" [ngStyle.md]="{'font-size': '12px'}"> </div> ``` Fixes angular#197.
This issue has been automatically locked due to inactivity. Read more about our automatic conversation locking policy. This action has been performed automatically by a bot. |
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
Labels
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
style
selectors to favorngStyle
selectors since the functionality extends NgStyle directive.class
selectors to favorngClass
selectors since the functionality extends NgClass directive.ngStyle
restores default (non-activated) inline styles when breakpoint deactivatesngStyle
merges default inline styles with activated stylesngStyle
selectors support Object notations or raw strings (ala html inline styles)[ngStyle]="{'font-size.px': 10, color: 'rgb(0,0,0)', 'text-align':'left'}"
style="font-size:10px; color:black; text-align:left;"
;
.style-transforms.ts
utilities and tests_buildStyleMap()
methodBREAKING CHANGE:
[style.<alias>]
selectors are deprecated in favor of[ngStyle.<alias>]
selectors[class.<alias>]
selectors are deprecated in favor of[ngClass.<alias>]
selectorsFixes #197.