角4 +玩笑 - 預置角：在主機與從文件

Question

我與Jest-Preset-Angular必須從一個單獨的文件中導入主機元素上的動畫組件上運行測試時，有一個問題問題進口觸發測試動畫（所以它可以在另一個組件中重用）。

example.animation.ts

import { trigger } from '@angular/animations'; 

export const ExampleAnimationHost = { '[@example]': '' }; 
export const ExampleAnimationTrigger = trigger('example', []); 

example.component.ts

import { Component } from '@angular/core'; 
import { ExampleAnimationHost, ExampleAnimationTrigger } from './example.animation'; 

@Component({ 
    selector: 'app-example', 
    templateUrl: './example.component.html', 
    styleUrls: ['./example.component.scss'], 
    animations: [ExampleAnimationTrigger], 
    host: ExampleAnimationHost, 
}) 
export class ExampleComponent { } 

的事實是，如果我複製粘貼觸發到的animations財產@Component修飾符我的測試通過...否則它失敗，因爲它似乎沒有找到動畫聲明。

任何想法？

Answer 1

我會回答我的問題，如果任何機構曾經有同樣的問題。

有一個問題here指定你需要把animations財產前styleUrls財產在@Component裝飾。

import { Component } from '@angular/core'; 
import { ExampleAnimationHost, ExampleAnimationTrigger } from './example.animation'; 

@Component({ 
    animations: [ExampleAnimationTrigger], // must be place before styleUrls 
    host: ExampleAnimationHost, 
    selector: 'app-example', 
    templateUrl: './example.component.html', 
    styleUrls: ['./example.component.scss'], 
}) 
export class ExampleComponent { } 

瞧！