These are chat archives for angular/material

27th
Jul 2017
Kyoz
@banminkyoz
Jul 27 2017 02:28
Hi guys. I'm using angular material sidenav. It have a problem like this: I set all the model before i call this.sideNav.open();
everything work fine.. but if i click to open sidenav fast and multiple time..The placeholder doesn't go up but in one line with text..
btw..it just occur when i do it in my tablet..with pc it's all fine
narendratech
@narendratech
Jul 27 2017 13:27

Hi Guys, i'm using angular2 material md-select. I want to set always default option in case of any option selected

<md-select [(ngModel)]="selectedlink" (change)="onLinkSelect()">
<md-option *ngFor="let link links" [value]="link.url">
{{link.name}}
</md-option>
</md-select>

narendratech
@narendratech
Jul 27 2017 14:15

Hi Guys, i'm using angular2 material md-select. I want to set always default option in case of any option selected

<md-select [(ngModel)]="selectedlink" (change)="onLinkSelect()">
<md-option *ngFor="let link links" [value]="link.url">
{{link.name}}
</md-option>
</md-select>

divyameher
@divyameher
Jul 27 2017 14:30
Anyone have an idea on how to make sidenav to occupy full height of an application eventhough when page is scrolled?
Jerely
@intranetsfr
Jul 27 2017 14:31
yes
try in css ;)
divyameher
@divyameher
Jul 27 2017 14:31
I have tried it
Jerely
@intranetsfr
Jul 27 2017 14:32
position: fixed, absolute ?
Sayan Bhattacharya
@tinker20
Jul 27 2017 14:32
@divyameher How are you placing the layout in your html?
Jerely
@intranetsfr
Jul 27 2017 14:33
i create #page{ min-height: 500px}
Andy
@ITAndy23
Jul 27 2017 14:33
Tried using the calls? <md-sidenav class="md-sidenav-left" >
divyameher
@divyameher
Jul 27 2017 14:33
providing only the following CSS will work opening od sidenav
position: inherit;
height: 100%;
display: inherit;
transform: inherit;
eventhough I'm passing height:100% it is not woling
Andy
@ITAndy23
Jul 27 2017 14:34
I think its because the parent element the sidenav lives in needs to have some height defined.
divyameher
@divyameher
Jul 27 2017 14:34
@crytechio It is not working
Andy
@ITAndy23
Jul 27 2017 14:35
If you don't have content to fill the 100% then it won't fill 100%. Otherwise, give it a fixed height(ideally the parent element so sidenav can use a 100% of that height).
divyameher
@divyameher
Jul 27 2017 14:36

my application structure will be like

<app-root>

<app-header>
contains combination of md-sidenav ,md-tabs
</app-header>

<router-link>-routes to every tabs
</app-root>

Andy
@ITAndy23
Jul 27 2017 14:36
divyameher
@divyameher
Jul 27 2017 14:37
@GokuSSL5 i can't provide fixed height
divyameher
@divyameher
Jul 27 2017 14:38
@GokuSSL5 here https://angular-material-starter.herokuapp.com/ when scrollbar is coming then I was not able to scroll the page when sidenav is opened

@tinker20 my layout will be like

<app-root>

<app-header>
contains combination of md-sidenav ,md-tabs
</app-header>

<router-link>-routes to every tabs
</app-root>

Luke Skelhorn
@SCRATK
Jul 27 2017 15:16
Hi I'm trying to add a value to my input form like this value="{{ event.name }}" and its giving the the error of Cannot read property 'description' of undefined
Jerely
@intranetsfr
Jul 27 2017 16:33
?????
@SCRATK [(ngModel]) you know ?
Manie Coetzee
@ramkat99
Jul 27 2017 17:44
Hi Guys, do any of you guys have an idea on how to create a expandable row (using cdk-table)?
I.a.w, when I clikc on a row, I expand it contents (like a td with a colspan that is hidden until you expand it)
maybe I should write my own md-row implementation and cater for it there?
*accordion
Manie Coetzee
@ramkat99
Jul 27 2017 17:52
Sorry, I should have been more clear
I’m using a data table
Md-table - want to use it as is except that I want to be able to expand the rows
like a typical master detail kind of scenario
Andy
@ITAndy23
Jul 27 2017 18:16
@ramkat99 I would say to add a function to the row's ng-click event . Handle it in your controller. Possibly calling to a service/factory to handle the DOM manipulation.
Manie Coetzee
@ramkat99
Jul 27 2017 18:18
I created my own material grid in angular 1, that did all of those things - paging, data source, etc - I’m busy looking at material2 and noticed that they use and encourage the use of the CDK components - the Material table is just a style wrapper for the CDK directives
I’m looking at the material source trying to figure out if I can extend/customize the cdRowDef directive
because essentially I want to provide a cdRowDef implementation that does a colspan and show/hide a complete row depending on a model property (show=true/false)
Andy
@ITAndy23
Jul 27 2017 18:40
ohhh gotcha. Didn't realize you were using material2.
Fred Myerscough
@oniice
Jul 27 2017 20:45
does material2 come with a global reset file?
losorio35
@losorio35
Jul 27 2017 22:06
Help please, I need to model 2 rows with 3 columns each row, and I can not do it, this is my code
   <div fxLayout="row"  fxFlex="50%"  >  
               <div  fxFlex >aaaaaaaaaaa</div>
               <div  fxFlex >aaaaaaaaaaa</div>
               <div  fxFlex >aaaaaaaaaaa</div>

          </div> 
          <div fxLayout="row"  fxFlex="50%" >  
               <div  fxFlex >bbbbbbbb</div>
               <div  fxFlex >bbbbbbbb</div>
               <div  fxFlex >bbbbbbbb</div>
          </div> 

        </div>
losorio35
@losorio35
Jul 27 2017 22:24
??