CODEWITHSUNDEEP
npmangularmaterial-design
MatthewScarpino
MatthewScarpino

Reputation: 5936

Using the Material Design package for Angular2

According to the angular/material2 site, component packages can be installed with commands like npm install @angular2-material/checkbox.

When I used this command, the @angular2-material/checkbox folder doesn't have a checkbox.ts file for the checkbox element. Instead, it has a checkbox.d.ts file that declares a regular class named MdCheckbox. This isn't a component, so I can't access it in my Angular2 template.

When I download the full angular/material2 archive, the src folder contains checkbox.ts, which defines MdCheckbox as a component. So is there a problem with the npm package or the GitHub archive?

Upvotes: 2

Views: 1031

Answers (1)

Abdulrahman Alsoghayer
Abdulrahman Alsoghayer

Reputation: 16540

In short, no there is no problems in it. The checkbox.d.ts file isn't a component file. It's just a declaration file. The actual file that has the component is checkbox.js, it's already been transpiled to javascript.

In order to use it, "assuming you have SystemJS as your module loader, which is the default". In your index.html

  System.config({
    map:{
      '@angular2-material/checkbox':'node_modules/@angular2-material/checkbox'
    },
    packages: {
      '@angular2-material/checkbox': {
        format: 'cjs',
        defaultExtension: 'js',
        main: 'checkbox.js'
      },
      app:{...}
    }
  });

And then, in your component:

import {MdCheckbox} from '@angular2-material/checkbox';

Upvotes: 3

Related Questions