2

I'm having some difficulties adding Angular Material to our ASP.NET CORE project. I've tried several ways to add it:

  1. Via Nuget - Although there is a package, NuGet didn't download anything
  2. Via Bower - According to Microsoft's docs, this is now the preferred way for working with client packages. But when I search for it in the Bower package mannager ui, it can't find it. Same with the bower.json file.

So how do I add it to the project? We need to replace all the Bootstrap references in our (new) project with angular material.

thanks,

ashilon

2 Answers 2

3

Just start typing angular in a new line in the bower.json file and the angular packages will appear in intellisense. When you type the colon after the name of the package and hit the space bar, give it a second and all available versions of that package will be displayed in intellisense.

When you save the file, Visual Studio will automatically run the bower install command to download the package and save it to the location defined in the directory setting in file .bowerrc.

To view the bower.json and .bowerrc files you have to select "Show All Files" in the Solution Explorer.

Sign up to request clarification or add additional context in comments.

3 Comments

It does find the Angular package but it doesn't find the Angular-Material package. I'm really getting despaired on this.
Mine finds it along with 100 something other angular packages. The latest version is 1.0.9. Try adding "angular-material": "1.0.9" to your bower.json file.
Bingo! Although in my case Visual Studio does not list angular material in the bower.json file, all I had to do is, well.... save the file. And taddaaaa, the package, with its dependencies is installed. Thanks a lot folks.
1

maybe this article will help you: Angular Material – Using with Angular 2 and ASP.NET Core 1.0

Step 2: Open the command prompt containing package.json and run below command to install Angular Material components. I am installing all the available packages now.

Command to install Material NPM packages

npm install --save @angular2-material/core @angular2-material/button @angular2-material/card  @angular2-material/checkbox @angular2-material/grid-list @angular2-material/icon @angular2-material/input @angular2-material/list @angular2-material/progress-bar @angular2-material/progress-circle @angular2-material/radio @angular2-material/sidenav  @angular2-material/tabs @angular2-material/toolbar

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.