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

fix(ivy): better support for i18n attributes on <ng-container>s (#33599) 

Prior to this commit, i18n runtime logic used `elementAttributeInternal` function (that uses `setAttribute` function under the hood) for all elements where i18n attributes are present. However the `<ng-container>` elements in a template may also have i18n attributes and calling `setAttribute` fails, since they are represented as comment nodes in DOM. This commit ensures that we call `setAttribute` on nodes with TNodeType.Element type (that support that operation) only.

PR Close #33599
This commit is contained in:
Andrew Kushnir 2019-11-05 11:12:27 -08:00 committed by Andrew Scott
parent e3895b8a95
commit 39550746f8
2 changed files with 33 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
packages/core/src/render3/i18n.ts
View File

@ -1011,9 +1011,13 @@ function i18nAttributesFirstPass(lView: LView, tView: TView, index: number, valu
generateBindingUpdateOpCodes(value, previousElementIndex, attrName), updateOpCodes);
}
} else {
elementAttributeInternal(previousElementIndex, attrName, value, lView);
// Check if that attribute is a directive input
const tNode = getTNode(previousElementIndex, lView);
// Set attributes for Elements only, for other types (like ElementContainer),
// only set inputs below
if (tNode.type === TNodeType.Element) {
elementAttributeInternal(previousElementIndex, attrName, value, lView);
}
// Check if that attribute is a directive input
const dataValue = tNode.inputs && tNode.inputs[attrName];
if (dataValue) {
setInputsForProperty(lView, dataValue, value);

27
packages/core/test/acceptance/i18n_spec.ts
View File

@ -1268,6 +1268,33 @@ onlyInIvy('Ivy i18n logic').describe('runtime i18n', () => {
expect(comp.attributes['messagetext']).toBe('Bonjour');
expect(comp.attributes['ng-reflect-message-text']).toBe('Bonjour');
});
it('should support i18n attributes on <ng-container> elements', () => {
loadTranslations({[computeMsgId('Hello', 'meaning')]: 'Bonjour'});
@Directive({selector: '[mydir]'})
class Dir {
@Input() mydir: string = '';
}
@Component({
selector: 'my-cmp',
template: `
<ng-container i18n-mydir="meaning|description" mydir="Hello"></ng-container>
`,
})
class Cmp {
}
TestBed.configureTestingModule({
declarations: [Cmp, Dir],
});
const fixture = TestBed.createComponent(Cmp);
fixture.detectChanges();
const dir = fixture.debugElement.childNodes[0].injector.get(Dir);
expect(dir.mydir).toEqual('Bonjour');
});
});
it('should work with directives and host bindings', () => {