文章/答案/技术大牛

发布

社区首页 >问答首页 >Angular2 :集成NG2材料的麻烦

问Angular2 :集成NG2材料的麻烦
EN

Stack Overflow用户

提问于 2016-01-28 10:43:30

回答 6查看 3.7K关注 0票数 7

我试图将NG2-材料集成到Angular2中。

Uncaught :angular2-poly滤料.138:138个未登录的SyntaxError:意外令牌<评估http://localhost:3000/ng2-material/all

import {MATERIAL_PROVIDERS, MATERIAL_DIRECTIVES} from 'ng2-material/all';

   @Component({

       template: `<md-content>
                 <button md-raised-button class="md-raised md-primary">Primary</button>
                 </md-content>`,
       styles: [style],
       providers:[ContactService, MATERIAL_PROVIDERS]
       directives:[MATERIAL_DIRECTIVES]
    })

 export class contact {
    constructor(){}
}

angular

angular-material

回答 6

Stack Overflow用户

发布于 2016-03-07 09:06:11

这是我的配置。啊，真灵。你可以试试。

System.config({
    packages: {        
      app: {
        format: 'register',
        defaultExtension: 'js'
      },
      'ng2-material': {
          defaultExtension: 'js'
       }
    },
    map: {
        'ng2-material': 'node_modules/ng2-material'
  },
});
System.import('app/main')
    .then(null, console.error.bind(console));

票数 8

Stack Overflow用户

发布于 2016-03-31 01:56:53

使用angular2-beta12和NG2-材料0.3.4

我在获得NG2材料的时候也有问题。

我在index.html文件中丢失的第一件事是声明css。

<link rel="stylesheet" href="node_modules/ng2-material/dist/ng2-material.css">
<link rel="stylesheet" href="node_modules/ng2-material/dist/font.css">

在那之后，我发现我缺少的一件重要的事情是，地图信息被嵌套在包括号中。一旦我将它移出我的System.config语句，如下所示：

Index.html

System.config({
        packages: {
            app: {
                format: 'register',
                defaultExtension: 'js'
            },
            'ng2-material': {//this needs to be nested in packages
                defaultExtension: 'js'
            }
        },
        map: {//The map location needs to be located outside of the package bracket
            'ng2-material': 'node_modules/ng2-material'
        }


    });

    System.import('app/main')
            .then(null, console.error.bind(console));

然后在我的main.ts文件中导入MATERIAL_PROVIDERS

Main.ts

import {MATERIAL_PROVIDERS} from "ng2-material/all";
import {AppComponent} from './app.component'


bootstrap(AppComponent, [MATERIAL_PROVIDERS]);

最后，在我导入的MATERIAL_DIRECTIVES上使用ng2材料的组件上。

create.component.ts

import {Component} from 'angular2/core';
import {RouterOutlet} from 'angular2/router';
import {MATERIAL_DIRECTIVES} from "ng2-material/all";



@Component({
   templateUrl: 'app/templates/create.html',
   directives: [RouterOutlet, MATERIAL_DIRECTIVES]

})
export class CreateComponent {...component code}

票数 1

Stack Overflow用户

发布于 2016-01-28 11:01:29

如果它无法为您找到库，请再次尝试npm install。

否则，如果确定已安装了库，请将其添加到index.html中

<script>
    System.config({
        defaultJSExtensions: true,
        packages: {
            "/angular2": {"defaultExtension": false}
        },
        map: {
            'ng2material': 'node_modules/ng2material'
        }
    });
</script>

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/35059201

复制

相似问题

问Angular2 :集成NG2材料的麻烦
EN

回答 6

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Angular2 :集成NG2材料的麻烦EN

回答 6

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Angular2 :集成NG2材料的麻烦
EN