angular2材质的“进度圆" [英] angular2 material "progress circle"
问题描述
如果我们使用angular-cli并将所有角形材料2放入其中并可以正常工作, 我们如何为index.html
If we using angular-cli and put in all the angular material 2 inside it and working fine, how do we add for an example progress circle to the index.html
<app-root>
<md-spinner>Loading..</md-spinner>
</app-root>
在此加载文本中,以便我们可以看到圆加载而不是纯文本
in this loading text so that we can see circle loading instead of plain text
我已经准备尝试将其导入到app-root component.ts 像这样
i allready try import that to app-root component.ts like this
import { Component } from '@angular/core';
import {MD_PROGRESS_CIRCLE_DIRECTIVES} from '@angular2-material/progress-circle';
@Component({
moduleId: module.id,
selector: 'app-root',
templateUrl: 'app.component.html',
styleUrls: ['app.component.css'],
directives:[MD_PROGRESS_CIRCLE_DIRECTIVES]
})
export class AppComponent {
title = 'app works!';
}
您知道如何使它在index.html中工作吗?
any idea how to make it works in index.html?
推荐答案
为了使其运行,请将以下两个语句添加到您的systemjs.config.js
文件中:
In order to make it run, add these two statements to your systemjs.config.js
file:
@angular2-material/progress-circle': 'node_modules/@angular2-material/progress-circle,
node_modules/@angular2-material/progress-circle': { main: 'progress-circle.js', defaultExtension: 'js' },
您可以在此图中看到这些语句的位置: systemjs.config.js文件
You can see the position of these statements in this image: systemjs.config.js file
当然,您首先需要使用npm安装该模块:
Of course, you need to first have installed the module using npm:
npm i @angular2-material/progress-circle
希望这会有所帮助:)
这篇关于angular2材质的“进度圆"的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!