Angular-cli包括ngAudio到您的项目

Angular-cli包括ngAudio到您的项目

问题描述:

安装ngAudio从http://danielstern.github.io/ngAudio/#/。 安装后,我应该将它包含在app.module.ts中,然后才能在我的项目中使用它。Angular-cli包括ngAudio到您的项目

因为标准“要求您的项目中的模块:angular.module('yourModule',['ngAudio'])”在网站上说的话,所以我对如何在这里包含它感到茫然对我没有任何意义。

我app.module.ts如下:我使用

//Modules 
import { BrowserModule } from '@angular/platform-browser'; 
import { NgModule } from '@angular/core'; 
import { FormsModule } from '@angular/forms'; 
import { HttpModule } from '@angular/http'; 
import { RouterModule, Route } from '@angular/router'; 

//routes 
const appRoutes: Route[] = 
    [ 
     { path: "soundwave", component: SoundwaveComponent }, 
     { path: "weather", component: WeatherComponent }, 
     { path: "movies", component: MoviesComponent }, 
     { path: "moviesearch", component: MoviesearchComponent }, 
     { path: "news", component: NewsComponent }, 
    ] 

//services 
import { TmdbService } from './services/tmdb.service'; 
import { NewsService } from './services/news.service'; 
import { WeatherService } from './services/weather.service'; 
import { SoundwaveService } from './services/soundwave.service'; 


//Angular Material 
import { MdButtonModule, MdToolbarModule, MdIconModule } from '@angular/material'; 

//special 
import 'hammerjs'; 


//component 
import { AppComponent } from './app.component'; 
import { MoviesComponent } from './movies/movies.component'; 
import { MoviesearchComponent } from './moviesearch/moviesearch.component'; 
import { NewsComponent } from './news/news.component'; 
import { SoundwaveComponent } from './soundwave/soundwave.component'; 
import { WeatherComponent } from './weather/weather.component'; 

//Pipes 
import { RoundPipe } from './pipes/round.pipe'; 
import { SubmitOnEnterDirective } from './directives/submit-on-enter.directive'; 

@NgModule({ 
    declarations: [AppComponent, MoviesComponent, MoviesearchComponent, NewsComponent, SoundwaveComponent, WeatherComponent, RoundPipe, SubmitOnEnterDirective], 
    imports: [BrowserModule, FormsModule, HttpModule, 
     RouterModule.forRoot(appRoutes), 
     MdButtonModule, MdToolbarModule, MdIconModule 
    ], 
    exports: [], 
    providers: [TmdbService, NewsService, WeatherService, SoundwaveService], 
    bootstrap: [AppComponent] 
}) 
export class AppModule { } 

文件夹结构:

enter image description here

+0

这个库适用于AngularJs,而不是Angular。 – developer033

这包是AngularJS,没有棱角。您将无法轻松将其添加到当前项目中。

在Angular中使用音频比JS更多。 Angular拥有所有的按钮和服务,但是您需要使用JavaScript处理音频。我建议使用npm提供的流行JavaScript包。 Howler.js可用,并且可以像任何其他npm软件包一样轻松地集成到任何Angular-CLI项目中。

您可以查看this安装问题。

+0

是否还有其他包可供我推荐使用?我正尝试通过按一个按钮激活音频。 – user3110254

+0

已更新的答案。 –

+0

thnx为答案。我会检查这个:) – user3110254