Skip to content
Permalink
Browse files

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
  • Loading branch information
mnahkies authored and kara committed Dec 16, 2019
1 parent 05b4f8e commit ee1eebd5d8555d33942ae3d207627cd6ef20e304
@@ -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
@@ -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',
});
}));

});
}

0 comments on commit ee1eebd

Please sign in to comment.
You can’t perform that action at this time.