角型スタック、外部ライブラリの使用方法

Question

私は角度2を使用する角型スタックを使用しています。純粋な角2対完全スタックの構造がかなり異なるように思われるので、私は他のガイドの後にいくつかの問題を抱えています。Angular2 & TypeScript importing of node_modules

私の質問は 私のクライアント側にはどのようにノードモジュールを使いますか？私はそれをインストールしましたか？ここで

私がこれまで試してみましたです：

• 私が使用したい外部のライブラリがhttps://www.npmjs.com/package/angular-star-ratingです（私は他の人を試みたにも関わらず）

• 私は「NPM角度のインストール-star-rating」

• ここで私は立ち往生しています。私はcomponent.tsでそれをインポートするなど、複数のことを試しました。私はそれを使用したい、HTMLでスクリプトを読み込み、そして私のapp.tsにモジュールをロードしたいです。私はsystem.config（system.jsから、私はそれが使用されているとは思うが）、またモジュールでロードできる@NgModuleを持つ場所も見ないので、app.tsに最適な場所があると思った。 「ギャルプサービス」を実行するとエラーが発生します。

  エラー./~/angular-star-rating/src/star-rating.component.ts モジュールの解析に失敗しました：[ディレクトリ]予期しない文字'@'（14：0） このファイルタイプを処理するには、適切なローダーが必要な場合があります。 にSyntaxError：予期しない文字 '@'（14：0）ここで

• は私のプロジェクトの構造を簡単に見ている：http://imgur.com/0AnAKBU

おかげで、任意のヘルプは大幅に

Answer 1

あなたが使用することができます高く評価されあなたがを使用

<div star-rating rating="starRating2" read-only="true" max-rating="7" click="click2(param)" mouse-hover="mouseHover2(param)" mouse-leave="mouseLeave2(param)"></div> 

そして、あなたはあまりにも、上記と同様に、あなたのスコープの内部で指定する必要があります。このような3210をパラメータとする。この場合、あなたは、スコープを作成し、以下では、このように値を定義します。

app.controller('appController', ['$scope', function ($scope) { 
    $scope.starRating2 = 5; 
}]) 

チェックこのlink

Answer 2

ステップ1：プロジェクトの依存関係として追加

npm install --save angular-star-rating 

ステップ2：インデックスに 追加.html

<script src="[bower or npm folder]/angular-star-rating/dist/index.js"></script> 

手順3：コンポーネント

import { StarRatingModule } from 'path/to/star/rating/star-rating.module'; 
@NgModule({ 
    ... 
    imports: [ 
    ... 
    StarRatingModule 
    ... 
    ] 
    ... 
}) 
export class AppModule { } 

ステップ4でインポート：アップデートHTML

<star-rating-comp 
     [size]="'large'" 
     [rating]="3" 
     [text]="'Rating:'" 
     (onRatingChange)="crtl.onRatingChange($event)"> 
</star-rating-comp>