honeymoose
/
angular-cn
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(common): ngStyle should ignore undefined values (#34422) 

Prior to ivy, undefined values passed in an object to the
ngStyle directive were ignored. Restore this behavior by
ignoring keys that point to undefined values.

closes #34310

PR Close #34422
This commit is contained in:
Michael Nahkies 2019-12-16 10:17:47 +00:00 committed by Kara Erickson
parent 23cf11a788
commit 1144ce97f9
2 changed files with 27 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
packages/common/src/directives/styling_differ.ts
View File

@ -214,7 +214,10 @@ function bulidMapFromValues(
let key = keys[i];
key = trim ? key.trim() : key;
const value = (values as{[key: string]: any})[key];
setMapValues(map, key, value, parseOutUnits, allowSubKeys);
if (value !== undefined) {
setMapValues(map, key, value, parseOutUnits, allowSubKeys);
}
}
} else {
// case 2: array

23
packages/common/test/directives/ng_style_spec.ts
View File

@ -157,6 +157,29 @@ import {ComponentFixture, TestBed, async} from '@angular/core/testing';
expectNativeEl(fixture).not.toHaveCssStyle('max-width');
expectNativeEl(fixture).toHaveCssStyle({'font-size': '12px'});
}));
it('should skip keys that are set to undefined values', async(() => {
const template = `<div [ngStyle]="expr"></div>`;
fixture = createTestComponent(template);
getComponent().expr = {
'border-top-color': undefined,
'border-top-style': undefined,
'border-color': 'red',
'border-style': 'solid',
'border-width': '1rem',
};
fixture.detectChanges();
expectNativeEl(fixture).toHaveCssStyle({
'border-color': 'red',
'border-style': 'solid',
'border-width': '1rem',
});
}));
});
}