本文整理匯總了TypeScript中@angular/animations.trigger函數的典型用法代碼示例。如果您正苦於以下問題：TypeScript trigger函數的具體用法？TypeScript trigger怎麽用？TypeScript trigger使用的例子？那麽, 這裏精選的函數代碼示例或許可以為您提供幫助。
在下文中一共展示了trigger函數的7個代碼示例，這些例子默認根據受歡迎程度排序。您可以為喜歡或者感覺有用的代碼點讚，您的評價將有助於係統推薦出更棒的TypeScript代碼示例。
示例1: it
it('should invoke a transition based on a property change', () => {
const engine = makeEngine();
const trig = trigger('myTrigger', [
transition('* => *', [style({height: '0px'}), animate(1000, style({height: '100px'}))])
]);
registerTrigger(element, engine, trig);
setProperty(element, engine, 'myTrigger', 'value');
engine.flush();
expect(engine.players.length).toEqual(1);
const player = MockAnimationDriver.log.pop() as MockAnimationPlayer;
expect(player.keyframes).toEqual([
{height: '0px', offset: 0}, {height: '100px', offset: 1}
]);
});示例2: it
it('should listen to the onStart operation for the animation', () => {
const engine = makeEngine();
const trig = trigger('myTrigger', [
transition('* => *', [style({height: '0px'}), animate(1000, style({height: '100px'}))])
]);
let count = 0;
registerTrigger(element, engine, trig);
listen(element, engine, 'myTrigger', 'start', () => count++);
setProperty(element, engine, 'myTrigger', 'value');
expect(count).toEqual(0);
engine.flush();
expect(count).toEqual(1);
});示例3: makeEngine
() => {
const engine = makeEngine();
const trig = trigger('something', [
state('on', style({height: '100px'})), state('off', style({height: '0px'})),
transition('on => off', animate(9876))
]);
registerTrigger(element, engine, trig);
setProperty(element, engine, trig.name, 'on');
setProperty(element, engine, trig.name, 'off');
engine.flush();
expect(element.style.height).not.toEqual('0px');
engine.players[0].finish();
expect(element.style.height).toEqual('0px');
});示例4: fadeInRight
public static fadeInRight(delay = 500) {
return trigger('fadeInRight', [
transition(':enter', animate(delay, keyframes([
style({
opacity: 0,
'transform': 'translate3d(100%, 0, 0)',
offset: 0
}),
style({
opacity: 1,
'transform': 'translate3d(0, 0, 0)',
offset: 1
}),
]))),
]);
}示例5: zoomIn
public static zoomIn(delay = 300) {
return trigger('zoomIn', [
transition(':enter', animate(delay, keyframes([
style({
opacity: 0,
'transform': 'scale3d(.3, .3, .3)',
offset: 0
}),
style({
opacity: 1,
'transform': 'scale3d(1, 1, 1)',
offset: .5
}),
])))
]);
}示例6: it
it('should cleanup all inner state that\'s tied to an element once removed', () => {
const engine = makeEngine();
const trig = trigger('myTrigger', [
transition(':leave', [style({height: '0px'}), animate(1000, style({height: '100px'}))])
]);
registerTrigger(element, engine, trig);
setProperty(element, engine, 'myTrigger', 'value');
engine.flush();
expect(engine.elementContainsData(DEFAULT_NAMESPACE_ID, element)).toBeTruthy();
engine.removeNode(DEFAULT_NAMESPACE_ID, element, true);
engine.flush();
expect(engine.elementContainsData(DEFAULT_NAMESPACE_ID, element)).toBeTruthy();
});示例7: makeEngine
() => {
const engine = makeEngine(new SuffixNormalizer('-normalized'));
const trig = trigger('something', [
state('on', style({height: 100})), state('off', style({height: 0})),
transition('on => off', animate(9876))
]);
registerTrigger(element, engine, trig);
setProperty(element, engine, trig.name, 'on');
setProperty(element, engine, trig.name, 'off');
engine.flush();
const player = MockAnimationDriver.log.pop() as MockAnimationPlayer;
expect(player.keyframes).toEqual([
{'height-normalized': '100-normalized', offset: 0},
{'height-normalized': '0-normalized', offset: 1}
]);
});