vimeo/player.js - 未定義のプロパティ 'nativeElement'を読み取ることができません

Question

タイトルに記載されているように、vimeo/player.jsをangular-cliアプリケーションに統合しようとするといくつか問題があります。

私は角4のための任意のサポートライブラリを発見していないので、私はの手順を以下のよモジュールバンドラで使用でをREADME.md。

私はVimeoの-player.component.tsを構築しました：

import { Component, AfterViewInit, ViewChild} from '@angular/core'; 
import { Player } from '@vimeo/player'; 

@Component({ 
    selector: 'app-vimeo-video-player', 
    templateUrl: './vimeo-player.component.html' 
}) 

export class VimeoVideoComponent implements AfterViewInit { 
    @ViewChild('vimeoVideoContainer') vimeoVideoContainer; 
    public player: Player; 

    ngAfterViewInit() { 
    this.player = new Player(this.vimeoVideoContainer.nativeElement, { 
     id: 19231868, // Generic Id 
     width: 640 
    }); 
    } 

} 

どこVimeoの-player.component.html：

<div id="vimeoVideoContainer"></div> 

そして、私は内側にそれを使用しようとしています別のテンプレートのコンポーネントmy.component.ts内側たとえばのテンプレート私が持っている：私は取得しています

<app-vimeo-video-player></app-vimeo-video-player> 

Cannot read property 'nativeElement' of undefinedでも私はngAfterViewInitを使用するために管理思いました。 new Player()...をトリガーする前にタイムアウトを設定すると、同じことが起こります。

私はこの問題をvimeo/player.js issuesに見つけましたが、それは私を助けませんでした。

EDIT 1：

@peinearydevelopmentで私は、この特定のエラーを解決したが、今私が取得しています：ERROR TypeError: __WEBPACK_IMPORTED_MODULE_1__vimeo_player__.Player is not a constructorを。

私は間違っていますか？これをどうすれば解決できますか？

Answer 1

変更にあなたのDIV：私は偉大なドキュメントを見つけることはできませんが<div #vimeoVideoContainer></div>

は、ここにViewChild documentationです。ドキュメントにはさまざまなセレクタ型でこれを使用するいくつかの異なる場所があります。ドキュメントからわかるように、カスタムコンポーネントを選択していないので、ここでは当てはまりそうなTypeを受け入れます。上記の構文は、要素を選択するために文字列を使用するときに最もよく見られるものです。 2番目の編集について

、import * as Player from '@vimeo/player/dist/player.js';