我可以将Angular Material 2.0.0-alpha.9-3与Angular 2.1一起使用吗? [英] Can I use Angular Material 2.0.0-alpha.9-3 with angular 2.1?

问题描述

我尝试在Angular 2.1中使用angular/material ^ 2.0.0-alpha.9-3，但出现异常:

I try to user angular/material ^2.0.0-alpha.9-3 with Angular 2.1, but I get the exceptions:

zone.js:1274 GET http://localhost:3000/@ angular/material 404 (未找到)

zone.js:1274 GET http://localhost:3000/@angular/material 404 (Not Found)

(索引):16错误:(SystemJS)XHR错误(找不到404)正在加载 http://localhost :3000/@ angular/material (…)

(index):16 Error: (SystemJS) XHR error (404 Not Found) loading http://localhost:3000/@angular/material(…)

我刚刚使用"Angular2 Quickstart"上的说明创建了项目，然后运行命令:"npm install --save @ angular/material".此命令之后，在node_modules/@ angular中添加了"material"文件夹.

I have just created project using instruction on "Angular2 Quickstart" and run the command: "npm install --save @angular/material". After this command the folder "material" in node_modules/@angular was added.

我的package.json是:

my package.json is:

{
  "name": "user-manager",
  "version": "1.0.0",
  "scripts": {
    "start": "tsc && concurrently \"tsc -w\" \"lite-server\" ",
    "lite": "lite-server",
    "postinstall": "typings install",
    "tsc": "tsc",
    "tsc:w": "tsc -w",
    "typings": "typings"
  },
  "licenses": [
    {
      "type": "MIT",
      "url": "https://github.com/angular/angular.io/blob/master/LICENSE"
    }
  ],
  "dependencies": {
    "@angular/common": "~2.1.0",
    "@angular/compiler": "~2.1.0",
    "@angular/core": "~2.1.0",
    "@angular/forms": "~2.1.0",
    "@angular/http": "~2.1.0",
    "@angular/material": "^2.0.0-alpha.9-3",
    "@angular/platform-browser": "~2.1.0",
    "@angular/platform-browser-dynamic": "~2.1.0",
    "@angular/router": "~3.1.0",
    "@angular/upgrade": "~2.1.0",
    "angular-in-memory-web-api": "~0.1.5",
    "bootstrap": "^3.3.7",
    "core-js": "^2.4.1",
    "reflect-metadata": "^0.1.8",
    "rxjs": "5.0.0-beta.12",
    "systemjs": "0.19.39",
    "zone.js": "^0.6.25"
  },
  "devDependencies": {
    "concurrently": "^3.0.0",
    "lite-server": "^2.2.2",
    "typescript": "^2.0.3",
    "typings": "^1.4.0"
  }
}

app.module.ts:

app.module.ts:

import { NgModule }      from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent }   from './components/app/app.component';
import { MaterialModule } from '@angular/material';

@NgModule({
    imports:      [ BrowserModule, MaterialModule.forRoot() ],
    declarations: [ AppComponent ],
    bootstrap:    [ AppComponent ]
})
export class AppModule { }

请问您能帮我吗?

推荐答案

更新

从2.0.0-beta.1钢筋杯开始

Since 2.0.0-beta.1 rebar-teacup

'@angular/material': 'npm:@angular/material/bundles/material.umd.js'

以前的版本

更改您的systemjs配置，例如:

Change your systemjs config like:

map: {
  app: 'app',
  '@angular/core': 'npm:@angular/core/bundles/core.umd.js',
  ...
  '@angular/material': 'npm:@angular/material/material.umd.js', <== add this line
},

另请参见 Angular2对于@ angular/material，材料设计alpha.9-3的"404未找到"

这篇关于我可以将Angular Material 2.0.0-alpha.9-3与Angular 2.1一起使用吗?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！