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

Revert "fix(animations): make sure @.disabled works in non-animation components" 

This reverts commit 01a2688848.
This commit is contained in:
Alex Rickabaugh 2017-07-14 11:00:29 -07:00
parent 01a2688848
commit f7686d4124
3 changed files with 22 additions and 86 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
packages/animations/browser/src/render/animation_engine_next.ts
View File

@ -67,17 +67,20 @@ export class AnimationEngine {
this._transitionEngine.removeNode(namespaceId, element, context);
}
disableAnimations(element: any, disable: boolean) {
this._transitionEngine.markElementAsDisabled(element, disable);
}
process(namespaceId: string, element: any, property: string, value: any) {
if (property.charAt(0) == '@') {
const [id, action] = parseTimelineCommand(property);
const args = value as any[];
this._timelineEngine.command(id, element, action, args);
} else {
this._transitionEngine.trigger(namespaceId, element, property, value);
process(namespaceId: string, element: any, property: string, value: any): boolean {
switch (property.charAt(0)) {
case '.':
if (property == '.disabled') {
this._transitionEngine.markElementAsDisabled(element, !!value);
}
return false;
case '@':
const [id, action] = parseTimelineCommand(property);
const args = value as any[];
this._timelineEngine.command(id, element, action, args);
return false;
default:
return this._transitionEngine.trigger(namespaceId, element, property, value);
}
}

55
packages/core/test/animation/animation_integration_spec.ts
View File

@ -1815,12 +1815,12 @@ export function main() {
selector: 'my-cmp',
template: `
<div class="parent" [@parent]="exp" (@parent.done)="cb('all','done', $event)">
<div *ngFor="let item of items"
<div *ngFor="let item of items"
class="item item-{{ item }}"
@child
(@child.start)="cb('c-' + item, 'start', $event)"
(@child.done)="cb('c-' + item, 'done', $event)">
{{ item }}
{{ item }}
</div>
</div>
`,
@ -2153,57 +2153,6 @@ export function main() {
expect(cmp.startEvent.totalTime).toEqual(9876);
// the done event isn't fired because it's an actual animation
}));
it('should work when there are no animations on the component handling the disable/enable flag',
() => {
@Component({
selector: 'parent-cmp',
template: `
<div [@.disabled]="disableExp">
<child-cmp #child></child-cmp>
</div>
`
})
class ParentCmp {
@ViewChild('child') public child: ChildCmp|null = null;
disableExp = false;
}
@Component({
selector: 'child-cmp',
template: `
<div [@myAnimation]="exp"></div>
`,
animations: [trigger(
'myAnimation',
[transition(
'* => go, * => goAgain',
[style({opacity: 0}), animate('1s', style({opacity: 1}))])])]
})
class ChildCmp {
public exp = '';
}
TestBed.configureTestingModule({declarations: [ParentCmp, ChildCmp]});
const fixture = TestBed.createComponent(ParentCmp);
const cmp = fixture.componentInstance;
cmp.disableExp = true;
fixture.detectChanges();
resetLog();
const child = cmp.child !;
child.exp = 'go';
fixture.detectChanges();
expect(getLog().length).toEqual(0);
resetLog();
cmp.disableExp = false;
child.exp = 'goAgain';
fixture.detectChanges();
expect(getLog().length).toEqual(1);
});
});
});

28
packages/platform-browser/animations/src/animation_renderer.ts
View File

@ -9,9 +9,6 @@ import {AnimationTriggerMetadata} from '@angular/animations';
import {ɵAnimationEngine as AnimationEngine} from '@angular/animations/browser';
import {Injectable, NgZone, Renderer2, RendererFactory2, RendererStyleFlags2, RendererType2} from '@angular/core';
const ANIMATION_PREFIX = '@';
const DISABLE_ANIMATIONS_FLAG = '@.disabled';
@Injectable()
export class AnimationRendererFactory implements RendererFactory2 {
private _currentId: number = 0;
@ -169,11 +166,7 @@ export class BaseAnimationRenderer implements Renderer2 {
}
setProperty(el: any, name: string, value: any): void {
if (name.charAt(0) == ANIMATION_PREFIX && name == DISABLE_ANIMATIONS_FLAG) {
this.disableAnimations(el, !!value);
} else {
this.delegate.setProperty(el, name, value);
}
this.delegate.setProperty(el, name, value);
}
setValue(node: any, value: string): void { this.delegate.setValue(node, value); }
@ -181,10 +174,6 @@ export class BaseAnimationRenderer implements Renderer2 {
listen(target: any, eventName: string, callback: (event: any) => boolean | void): () => void {
return this.delegate.listen(target, eventName, callback);
}
protected disableAnimations(element: any, value: boolean) {
this.engine.disableAnimations(element, value);
}
}
export class AnimationRenderer extends BaseAnimationRenderer implements Renderer2 {
@ -196,12 +185,9 @@ export class AnimationRenderer extends BaseAnimationRenderer implements Renderer
}
setProperty(el: any, name: string, value: any): void {
if (name.charAt(0) == ANIMATION_PREFIX) {
if (name.charAt(1) == '.' && name == DISABLE_ANIMATIONS_FLAG) {
this.disableAnimations(el, !!value);
} else {
this.engine.process(this.namespaceId, el, name.substr(1), value);
}
if (name.charAt(0) == '@') {
name = name.substr(1);
this.engine.process(this.namespaceId, el, name, value);
} else {
this.delegate.setProperty(el, name, value);
}
@ -209,13 +195,11 @@ export class AnimationRenderer extends BaseAnimationRenderer implements Renderer
listen(target: 'window'|'document'|'body'|any, eventName: string, callback: (event: any) => any):
() => void {
if (eventName.charAt(0) == ANIMATION_PREFIX) {
if (eventName.charAt(0) == '@') {
const element = resolveElementFromTarget(target);
let name = eventName.substr(1);
let phase = '';
// @listener.phase is for trigger animation callbacks
// @@listener is for animation builder callbacks
if (name.charAt(0) != ANIMATION_PREFIX) {
if (name.charAt(0) != '@') { // transition-specific
[name, phase] = parseTriggerCallbackName(name);
}
return this.engine.listen(this.namespaceId, element, name, phase, event => {