cargdev/angular
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(ivy): setting up animation properties correctly (FW-643) (#27496)

Browse Source 
Prior to this change, animation properties were defined as element attributes, which caused errors at runtime. Now all animation-related attributes are defined as element properties.

Also as a part of this update, we start to account for bindings used in animations, which was previously missing.

PR Close #27496
This commit is contained in:
Andrew Kushnir
2018-12-05 15:56:36 -08:00
committed by Igor Minar
parent 4da739a970
commit c71d7b5633
10 changed files with 59 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/compiler/src/render3/view/compiler.ts
View File

@ -307,10 +307,10 @@ export function compileComponentFromMetadata(
definitionMap.set('encapsulation', o.literal(meta.encapsulation));
}
// e.g. `animations: [trigger('123', [])]`
// e.g. `animation: [trigger('123', [])]`
if (meta.animations !== null) {
definitionMap.set(
'data', o.literalMap([{key: 'animations', value: meta.animations, quoted: false}]));
'data', o.literalMap([{key: 'animation', value: meta.animations, quoted: false}]));
}
// On the type side, remove newlines from the selector as it will need to fit into a TypeScript

7
packages/compiler/src/render3/view/template.ts
View File

@ -41,11 +41,11 @@ import {CONTEXT_NAME, IMPLICIT_REFERENCE, NON_BINDABLE_ATTR, REFERENCE_PREFIX, R
function mapBindingToInstruction(type: BindingType): o.ExternalReference|undefined {
switch (type) {
case BindingType.Property:
case BindingType.Animation:
return R3.elementProperty;
case BindingType.Class:
return R3.elementClassProp;
case BindingType.Attribute:
case BindingType.Animation:
return R3.elementAttribute;
default:
return undefined;
@ -622,10 +622,11 @@ export class TemplateDefinitionBuilder implements t.Visitor<void>, LocalResolver
const instruction = mapBindingToInstruction(input.type);
if (input.type === BindingType.Animation) {
const value = input.value.visit(this._valueConverter);
// setAttribute without a value doesn't make any sense
// setProperty without a value doesn't make any sense
if (value.name || value.value) {
this.allocateBindingSlots(value);
const name = prepareSyntheticAttributeName(input.name);
this.updateInstruction(input.sourceSpan, R3.elementAttribute, () => {
this.updateInstruction(input.sourceSpan, R3.elementProperty, () => {
return [
o.literal(elementIndex), o.literal(name), this.convertPropertyBinding(implicit, value)
];