angular-material2

Using Angular 2 with material design, trying to get nested lists in sidenav I have code like <md-sidenav #sidenav class="sidenav" mode="over" opened> <md-nav-list> <md-card class="user-card"> <md-card-header> <div md-card-avatar class="user-avatar"></div> </md-card-header> </md-card> <md-divider></md-divider> <md-list-item *ngFor="let category of ategories"> <a md-line>{{ category.name }}</a> </md-list-item> </md-nav-list> </md-sidenav> which works fine and looks something like Now When i try to nest it, like <md-sidenav #sidenav class="sidenav" mode="over" opened> <md-nav-list> <md-card class

I have this, which I would assume to work, but doesn't: <mat-icon color="white">home</mat-icon> Then, I also have: <button mat-raised-button color="accent" type="submit" [disabled]="!recipientForm.form.valid"> <mat-icon color="white">save</mat-icon>SAVE </button> This code snippet, for some reason, does work (shows the icon as white). How do I get the lone mat-icon to show up as white using the color attribute? (I can easily just add a white class, but I want to understand this) That's because the color input only accepts three attributes: "primary" , "accent" or "warn" . In other words, you

I am new to Angular 4 and angular material and i am trying to add the angular material data table with http, pagination, sorting and filtering into my dashboard component, With hard-coded array i was able to achieve filter, sort and pagination. But i am not able to pass a json data from service into the array. Any help would be appreciated. Thanks in advance..!!! Please find my code below. test.json [{ "FirstName": "Jill", "LastName": "Smith", "Score": "disqualified" }, { "FirstName": "Eve", "LastName": "Jackson", "Score": "94" }, { "FirstName": "John", "LastName": "Doe", "Score": "80" }, {

I have angular 4 project with material 2, I want to filter the data in MatTable. DataSource filter is working fine when we filter data on field which are not nested. this.dataSource = new MatTableDataSource([ { orderNumber: 1, orderInfo: { type: 'ABC'}, date: '12/3/2012 9:42:39 AM'}, { orderNumber: 3, orderInfo: { type: 'Hello' }, date: '12/2/2018 9:42:39 AM'}, ]); Filter is working fine for orderNumber, date but not working properly with type field in orderInfo object. Sagar Kharche DataSource has filterPredicate() method that needs to override in our application as follows. Add this code in