angular5のマテリアルデザインに移行する

Question

私は、ブートストラップを備えたangular4アプリを開発しています。 私はちょうどangular5に移動し、代わりにプライム-NGのNG-bootrap剣道-UIなどのコンポーネントのための材料設計を使用する場合ではないかしら...コンソールで おかげ

Answer 1

：

ng new pjt 
cd pjt 

npm install @angular/material @angular/cdk --save 
npm install @angular/animations --save 

アプリ/モジュール/ material.module.tsファイルを作成し、次のとおりです

import { NgModule } from '@angular/core'; 
import { CommonModule } from '@angular/common'; 
import { MatButtonModule } from '@angular/material'; 

@NgModule({ 
imports: [MatButtonModule], 
exports: [MatButtonModule], 
}) 

export class MaterialModule { } 

注各要素のマットを...モジュールをインポート、輸入に分離上記のファイルコンマで追加する必要を使用したいと行をエクスポートします。

を含むようにコンソールで

npm install hammerjs --save 

更新main.tsを

@import "~@angular/material/prebuilt-themes/indigo-pink.css"; 

を含むこと

import { BrowserAnimationsModule} from '@angular/platform-browser/animations'; 
import { MaterialModule } from './modules/material.module'; 
... 
imports: [ 
... 
BrowserAnimationsModule, 
MaterialModule 
], 

更新styles.scssを含める

更新アプリ/ app.modules.ts

import 'hammerjs'; 

コンソール

ng serve 

で

<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> 

を含むように

更新のindex.htmlそして、あなたは、例えば、あなたのコンポーネントに材料要素を含む開始することができます<button mat-button>Some Btn<button> ...要素のmaterial.angular.ioを確認してください...

詳細については、https://coursetro.com/posts/code/113/How-to-Build-an-Angular-5-Material-Appをチェックしてください。