!tigLUmlwJZDNSZENWC:matrix.org

Angular Material

71 Members
Material Design components for Angular https://material.angular.io3 Servers

Load older messages


SenderMessageTime
2 Mar 2021
@danww-570ea9ac187bb6f0eadf50f3:gitter.imdanww (Daniel Willis) @SV9045 Yes. Share wth us a Stackblitz of your code so far, and I can help you. 19:53:11
5 Mar 2021
@vinaymcscet-60419f9f6da0373984658caa:gitter.imvinaymcscet (vinay kumar) joined the room.03:06:23
@vinaymcscet-60419f9f6da0373984658caa:gitter.imvinaymcscet (vinay kumar)

Hello, I have below code of Mat-select with virtual-scroll.
I have get the value of mat-select in formBuilder but did not reflect the value which I select in the mat-item-select.

<mat-form-field appearance="outline">
<mat-select multiple (openedChange)="openChange($event)" formControlName="itemSelect">
<mat-select-trigger>
{{ itemTrigger }}
</mat-select-trigger>
<cdk-virtual-scroll-viewport itemSize="5" minBufferPx="200" maxBufferPx="400" class="example-viewport-select">
<mat-option *cdkVirtualFor="let list of skillSet" [value]="list.data" (onSelectionChange)="onSelectionChange($event)">
{{list.data}}
</mat-option>
</cdk-virtual-scroll-viewport>
</mat-select>
<mat-error *ngIf="!addCompany.controls['itemSelect'].valid && addCompany.controls['itemSelect'].touched">
{{ titleAlert }}
</mat-error>
</mat-form-field>

03:06:24
@vinaymcscet-60419f9f6da0373984658caa:gitter.imvinaymcscet (vinay kumar) I did not get the value in itemTrigger. Please help me to find the error 03:07:19
@vicatcu-55cb7b8d0fc9f982bead2989:gitter.imvicatcu (Victor Aprea) joined the room.19:13:23
@vicatcu-55cb7b8d0fc9f982bead2989:gitter.imvicatcu (Victor Aprea) hi all, just getting started with nx workspaces and am finding it difficult to figure out how to add angular material to projects in it 19:13:24
@vicatcu-55cb7b8d0fc9f982bead2989:gitter.imvicatcu (Victor Aprea) no matter where I run the command ng add @angular/material as per the getting started docs, I get the message The add command requires to be run in an Angular project, but a project definition could not be found. 19:14:01
@vicatcu-55cb7b8d0fc9f982bead2989:gitter.imvicatcu (Victor Aprea) anyone know how to do it? 19:14:10
@intellix-54352950163965c9bc209ca8:gitter.imintellix (Dominic Watson) joined the room.19:21:39
@intellix-54352950163965c9bc209ca8:gitter.imintellix (Dominic Watson) really struggling with Stepper... the logic doesn't make sense when using it programatically 19:21:40
@intellix-54352950163965c9bc209ca8:gitter.imintellix (Dominic Watson) I want a "3 easy steps" style stepper. You start off on the first step, you click "next" and it goes to the second step etc..... so I have a property on my wrapping component: "selectedIndex = 0"
<mat-horizontal-stepper [linear]="true" [selectedIndex]="selectedIndex">
  <mat-step *ngFor="let step of steps; let i = index" [editable]="true" [optional]="false" [completed]="selectedIndex > i">
19:21:59
@intellix-54352950163965c9bc209ca8:gitter.imintellix (Dominic Watson) * I want a "3 easy steps" style stepper. You start off on the first step, you click "next" and it goes to the second step etc..... so I have a property on my wrapping component: "selectedIndex = 0" 19:22:17
@intellix-54352950163965c9bc209ca8:gitter.imintellix (Dominic Watson) * I want a "3 easy steps" style stepper. You start off on the first step, you click "next" and it goes to the second step etc..... so I have a property on my wrapping component: "selectedIndex = 0"
<mat-horizontal-stepper [linear]="true" [selectedIndex]="selectedIndex"
19:22:36
@intellix-54352950163965c9bc209ca8:gitter.imintellix (Dominic Watson) * I want a "3 easy steps" style stepper. You start off on the first step, you click "next" and it goes to the second step etc..... so I have a property on my wrapping component: "selectedIndex = 0"
<mat-horizontal-stepper [linear]="true" [selectedIndex]="selectedIndex"

<mat-step *ngFor="let step of data.steps; let i = index; trackBy: getObjectIdentity" [editable]="true" [optional]="false" [completed]="selectedIndex > i"
19:22:55
@intellix-54352950163965c9bc209ca8:gitter.imintellix (Dominic Watson) * I want a "3 easy steps" style stepper. You start off on the first step, you click "next" and it goes to the second step etc..... so I have a property on my wrapping component: "selectedIndex = 0"
<mat-horizontal-stepper [linear]="true" [selectedIndex]="selectedIndex"

<mat-step *ngFor="let step of steps; let i = index" [editable]="true" [optional]="false" [completed]="selectedIndex > i"
19:23:08
@intellix-54352950163965c9bc209ca8:gitter.imintellix (Dominic Watson) * I want a "3 easy steps" style stepper. You start off on the first step, you click "next" and it goes to the second step etc..... so I have a property on my wrapping component: "selectedIndex = 0"
<mat-horizontal-stepper [linear]="true" [selectedIndex]="selectedIndex">
  <mat-step *ngFor="let step of steps; let i = index" [editable]="true" [optional]="false" [completed]="selectedIndex > i">
19:23:23
@intellix-54352950163965c9bc209ca8:gitter.imintellix (Dominic Watson) you're on the first step, it's the selectedIndex... makes sense. If you're on greater index, the previous ones are completed, obviously so selectedIndex=1 means that index 0 is complete 19:24:05
@intellix-54352950163965c9bc209ca8:gitter.imintellix (Dominic Watson) but when I change selectedIndex from 0 to 1, it seems to not work because completed is still false on the first step, which gets evaluated later 19:24:26
@intellix-54352950163965c9bc209ca8:gitter.imintellix (Dominic Watson) * but when I change selectedIndex from 0 to 1, it seems to not work because completed is still false on the first step, which gets evaluated later 19:24:34
@intellix-54352950163965c9bc209ca8:gitter.imintellix (Dominic Watson) can I not just disable the validation of that since it's clearly on drugs? 19:25:01
@intellix-54352950163965c9bc209ca8:gitter.imintellix (Dominic Watson) I'm not using matStepperPrevious or matStepperNext cause the buttons are added dynamically and I need to handle the index manually and am not able to add those directives 19:26:44
@intellix-54352950163965c9bc209ca8:gitter.imintellix (Dominic Watson) * I'm not using matStepperPrevious or matStepperNext cause the buttons are added dynamically and I need to handle the index manually and am not able to add those directives 19:26:51
@intellix-54352950163965c9bc209ca8:gitter.imintellix (Dominic Watson) it seems like [completed] is even problematic when using stepper.next/previous() 19:32:20
@intellix-54352950163965c9bc209ca8:gitter.imintellix (Dominic Watson) this seems to work:
this.completedIndex = this.selectedIndex < this.data.steps.length - 1 ? this.selectedIndex + 1 : this.data.steps.length - 1;
setTimeout(() => {
  this.selectedIndex = this.completedIndex;
  this.cd.detectChanges();
});
19:42:08
@intellix-54352950163965c9bc209ca8:gitter.imintellix (Dominic Watson) seems i'm not alone angular/components#19445 20:08:54
@luisvt-55d5e8bb0fc9f982beae0d63:gitter.imluisvt (Luis Vargas) joined the room.22:23:48
@luisvt-55d5e8bb0fc9f982beae0d63:gitter.imluisvt (Luis Vargas) In general that happens because your console work directoy is outside the project root 22:23:49
6 Mar 2021
@xender007-60439b136da037398465b9cb:gitter.imXender007 (Suprotim Mukherjee) joined the room.21:12:07
@xender007-60439b136da037398465b9cb:gitter.imXender007 (Suprotim Mukherjee) Hi 21:12:07
@xender007-60439b136da037398465b9cb:gitter.imXender007 (Suprotim Mukherjee) I am new here!! can anyone help me how to do docs contribution ? 21:13:05

There are no newer messages yet.


Back to Room List