Góc 4 hoạt hình đến chiều cao *

Question

Tôi đã bối rối với một thứ mà tôi có thể nghĩ là một lỗi trong mô-đun hoạt hình trong Angular 4. Với hoạt ảnh trong Angular 2.x, tôi đã tạo một hoạt ảnh động từ độ cao * đến chiều cao cố định. Điều này làm việc hoàn toàn tốt trong Angular 2. Khi sử dụng Angular 4 mặt khác, chiều cao của phần tử có các hình ảnh động áp dụng cho nó bị lỗi khi quay lại các hình ảnh động trước khi nó đã hoàn thành. Chiều cao ký tự đại diện (*) là những gì dường như đang gây ra vấn đề. Dưới đây là một đoạn giới thiệu có thể tái tạo sự cố. Các lỗi có thể được kích hoạt nếu bạn nhấp đúp vào phần tử khi nó đang ở trong trạng thái * -height:

import { Component } from '@angular/core'; 
import { trigger, animate, state, transition, style } from '@angular/animations'; 

@Component({ 
    selector: 'app-root', 
    template: ` 
    <h1 [@toggleAnimation]="isEnabled" (click)="isEnabled = isEnabled === 'active' ? 'inactive' : 'active'" style="background: blue"> 
    {{title}} 
    </h1>`, 
    animations: 
    [ 
    trigger('toggleAnimation', [ 
     state('active', style({ 
     height: '*', 
     })), 
     state('inactive', style({ 
     height: '600px', 
     })), 
     transition('active <=> inactive', animate('500ms ease-in-out')) 
    ]) 
    ] 
}) 
export class AppComponent { 
    title = 'app works!'; 
    isEnabled = 'inactive'; 
} 

Có điều gì sai trái với làm thế nào tôi animate chiều cao bằng cách sử dụng giá trị ký tự đại diện, hoặc là có cái gì đó sai Infact với cách chiều cao ký tự đại diện hoạt động?

Answer 1

Xuất hiện được một lỗi: https://github.com/angular/angular/issues/15507

Rõ ràng ! là một giá trị 'bí mật' trong 4.2.0-rc.1 mà dường như khắc phục vấn đề, nhưng điều này dường như không được cái gì đó được hỗ trợ chính thức hoặc sẽ được hỗ trợ trong bản phát hành chính thức.

https://plnkr.co/edit/pZamSqPX9Vb4J6JL721u?p=preview cho thấy nó làm việc trong 4.2.0-rc.1 với !, và sau đó chỉ cần đi đến config.js và thay đổi để 4.0.0 và thay đổi ! trở lại * để xem làm thế nào nó lỗi một lần nữa.