Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Repo info
Activity
  • Jul 11 2016 19:26

    Splaktar on master

    fix(toast): apply theming corre… perf(icon): better handling of … fix(list): copy ng-show, ng-hid… and 49 more (compare)

  • Jun 15 2016 16:14

    Splaktar on v1.1.0-rc.5

    release: version 1.1.0-rc.5 (compare)

  • May 14 2016 05:55

    Splaktar on master

    feat(panel): initial implementa… update(panel): promise logic im… update(panel): add and remove p… and 44 more (compare)

  • May 05 2016 20:47

    Splaktar on v1.1.0-rc4

    release: version 1.1.0-rc4 (compare)

  • May 05 2016 20:47

    Splaktar on v1.1.0-rc3

    release: version 1.1.0-rc3 (compare)

  • May 03 2016 22:28

    Splaktar on es6-tutorial

    Prepare clean start Remove bow… install angular-material And i… working version of starter-app and 19 more (compare)

  • May 03 2016 22:22

    Splaktar on master

    Tutorial Readme updates Updates for Tutorial #2 Update README with tutorial ste… and 56 more (compare)

  • May 01 2016 22:56

    Splaktar on fixBlurryRightNavIe11

    fix(sidenav): rightNav button a… (compare)

  • May 01 2016 22:37

    Splaktar on master

    fix(dialog): don't clobber md-d… update version number in packag… update(changelog): sort so 1.1.… and 1 more (compare)

  • May 01 2016 22:34

    Splaktar on fixSideNavDemo

    docs(sidenav): leftNav text isn… (compare)

  • Apr 27 2016 04:14

    Splaktar on fixSideNavDemo

    docs(sidenav): invalid `md-whit… (compare)

  • Apr 27 2016 03:54

    Splaktar on master

    update(changelog): add missing … fix(toolbar): remove transition… fix(tests): Cleans up the DOM a… and 2 more (compare)

  • Apr 23 2016 01:32

    Splaktar on master

    update(docs): improve docs for … update(docs): renamed `md-text-… fix(list): clickable list-items… and 71 more (compare)

  • Apr 11 2016 03:20

    Splaktar on improveExtendThemeDoc

    update(docs): improve docs for … (compare)

  • Apr 11 2016 03:15

    Splaktar on improveExtendThemeDocs

    update(docs): improve docs for … (compare)

  • Apr 11 2016 02:57

    Splaktar on updateThemingDocs

    update(docs): renamed `md-text-… (compare)

  • Apr 11 2016 02:48

    Splaktar on master

    fix(demo, codepen): use secure … fix(build, layout): remove depr… update(build): remove stale bow… and 72 more (compare)

  • Apr 11 2016 02:48

    Splaktar on v1.1.0-rc2

    release: version 1.1.0-rc2 (compare)

  • Mar 19 2016 03:00

    Splaktar on master

    fix(checkbox): pointer events d… update(tests): remove disabled/… fix(datepicker): enable scrolli… and 20 more (compare)

  • Mar 13 2016 05:41

    Splaktar on v1.0.6

    Revert "fix(select): made selec… update(layout): add layout-nowr… fix(whiteframe): update breakpo… and 57 more (compare)

Githamza
@Githamza

I'm using angular material datatable

My datasource is simply an array

My problem is when I add new values to the data array , I don't see it immediately on the datatable

import { Component, OnInit } from '@angular/core';
import { MatTableDataSource } from '@angular/material';
import { AjouttextService } from '../ajouttext.service';
import { DataSource } from "@angular/cdk/collections";
import { Observable } from "rxjs/Observable";
import { nomchamp } from '../model';

@Component({
  selector: 'app-datatable',
  templateUrl: './datatable.component.html',
  styleUrls: ['./datatable.component.css']
})
export class DatatableComponent implements OnInit {

  constructor(private dataService: AjouttextService) { }
  data: nomchamp[] = [{ id: "33", text: "HAHA" }, { id: "55", text: "bzlblz" }];

  displayedColumns = ['text'];
  dataSource = new MatTableDataSource(this.data);
  //new UserDataSource(this.dataService);


  applyFilter(filterValue: string) {
    filterValue = filterValue.trim(); // Remove whitespace
    filterValue = filterValue.toLowerCase(); // MatTableDataSource defaults to lowercase matches
  }
  ngOnInit() {
  }
  ajoutText(newtext: String) {
    let nouv: nomchamp = { id: "44", text: newtext };
    this.data.push(nouv);
  }
}
cdskill
@cdskill
@Githamza dans ta fonction, ajoutText rajoute un parametre table: any ou tu donne le #table dans ton .html
ensuite tu appelles la fonction renderRows() dessus
ajoutText(newtext: String, table:any) {
    let nouv: nomchamp = { id: "44", text: newtext };
    this.data.push(nouv);
    table.renderRows();
  }
Githamza
@Githamza
@cdskill Merci je testerai ca ce soir
Githamza
@Githamza
@cdskill I have done what you have asked me to do I got this error ERROR TypeError: table.renderRows is not a function
L33tCh
@L33tCh
@Githamza Hmm. I see another option is to deliver the data by subscribing to an observable stream but there is little info on how to implement and a few calls logged on getting better documentation around it: angular/material2#8227
I haven't tried it though but maybe the example in the comments of the issue can help (or possible one of the linked issues).
Hadi Mousavi
@mousavidev
hi, why did you use gulp in material project?
cdskill
@cdskill
my issue is solved thx
chanddessai10
@chanddessai10
In typescript how can we add a tooltip to mat-input using the id through ts code? (Here the mat-input-field is generated through ngFor, and I am using the dynamically provided ID which angular provides )
Toni
@SpeedoPasanen
@chanddessai10 why do you need to do it in ts? you can add a mat-tooltip to the element in the template and pass it a dynamic value
chanddessai10
@chanddessai10
@funkizer I get that
Githamza
@Githamza
Hello , If I create an app using angular with firebase to store and get data, car I host it in github static pages ?
MattHubbell
@MattHubbell
@Githamza you can deploy your app to firebase. Doeload and install firebase-tools
bwhiting2356
@bwhiting2356
You could also deploy to github pages, but firebase hosting is awesome
deploy from the command line, built in CDN, secure. Lots of benefits
Luke Crooks
@crooksey
Morning everyone, any idea why the following is not rendering correclty? I expexted all of my buttons in the list to be scrollable, however they just render as: https://stackblitz.com/edit/angular-cccnjp?file=app%2Fsidenav-responsive-example.html
chanddessai10
@chanddessai10
image.png In this I have the capability to rename the field where rename value should be unique. If rename value is duplicate I need to show <mat-icon> only to that particular field with duplicate value. Can anybody help me out with this?
satishgorijala-github
@satishgorijala-github
Value not pertaining even after it met the condition.

<mat-tab-group [selectedIndex]="tabselectedIndex">

ngOnInit() {

 this.tabselectedIndex = 0;
    this._router.events
    .filter(e => e instanceof RoutesRecognized)
    .pairwise()
    .subscribe((e: any[]) => {
      console.log(this.previousRoute);
      this.previousRoute = e[0].urlAfterRedirects;
        if (this.previousRoute === '/contactus') {
                    this.tabselectedIndex = 1;
                    alert(this.tabselectedIndex);
                  }
              });

}

Though it met the critieria and the alert popup shows value as "1", but in html for the mat-tab the value is not changing to "1". Always the value is "0". what i am missing here
VishwajitShinde
@VishwajitShinde
Hello Guys
Why my mat-table columns are not sorting?
<mat-header-cell *matHeaderCellDef mat-sort-header="true" > {{ column.myHeader }} </mat-header-cell> . Am I missing anything into this?
satishgorijala-github
@satishgorijala-github
@VishwajitShinde - You can try as below
<mat-table #table [dataSource]="dataSource" matSort>
                  <ng-container matColumnDef="colname">
                    <mat-header-cell *matHeaderCellDef mat-sort-header> column heading </mat-header-cell>
                  </ng-container>
labyed
@labyed
hey guys, is there a way to select only months and years in datepicker, ty
Nate Gardner
@natejgardner
I'm having a bit of trouble with the datepicker- getting Can't bind to 'matDatePicker' since it isn't a known property of 'input'.

Template

<mat-form-field>
          <input [matDatePicker]="myDatePicker">
          <mat-datepicker #myDatePicker></mat-datepicker>
</mat-form-field>

It's imported in my app module:

import { ..., MatDatepickerModule, MatNativeDateModule,...} from '@angular/material`;
...
@NgModule({...,imports: [ ...,MatDatepickerModule, MatNativeDateModule,...],...})
Any ideas on what to try?
Luke Crooks
@crooksey
Anyone know how I can force dynamic rendered content into a certain grid list? Example here: https://stackblitz.com/edit/angular-cccnjp-3dieg1?file=app%2Fsidenav-responsive-example.html
    <mat-grid-list cols="2"  rowHeight="8:1">
    <mat-grid-tile>
        <mat-grid-tile-header>Clocked In</mat-grid-tile-header>
    </mat-grid-tile>
    <mat-grid-tile >
        <mat-grid-tile-header>Clocked Out</mat-grid-tile-header>
    </mat-grid-tile>

    <!-- render this inside Clocked In Column -->
    <mat-grid-tile *ngFor="let user of usersIn">
        <button mat-raised-button color="accent">
            {{user}}
        </button>
    </mat-grid-tile>

    <!-- render this inside Clocked out Column -->
    <mat-grid-tile *ngFor="let user of usersOut">
        <button mat-raised-button color="warn">
            {{user}}
        </button>
    </mat-grid-tile>

</mat-grid-list>
Filip Białek
@fbialek
hi there! can anybody share with me sass function or mixin for generating sass map with custom map for material color palette? so basically I would like to have a sass function that I can pass one color and it returns whole map with a palette.
Ahmad Abu Maizer
@embryologist

I have a mat-form-field with input/select elements and I am having hard time changing the placeholder/floating label color on ng-valid or ng-pending without changing the encapsulation, any advice would be really appreciated
the only way that I was able to change the placeholder/floating label is using the following,

body .mat-input-placeholder {
  color: rgba(13, 131, 209, 0.699);
}

how can I add ng-pending and ng-valid as well

Jakob Knutsen
@jakkn
is there a limitation on which mat- components that support errorStateMatcher?
question motivated by this error "Can't bind to 'errorStateMatcher' since it isn't a known property of 'mat-radio-group'."
bwhiting2356
@bwhiting2356
has anyone used Angular Material inside an Ionic app? I'm using Ionic as a PWA and in my desktop layout I would like to use some material components. I have the modules imported, and I think I imported the styles, but it's not looking right.
YuvaRaj Raghunapu
@mdmyr
Hi all,
am trying to using .html <mat-toolbar>My App</mat-toolbar> after installing the material; but am getting error as "'mat-toolbar' is not a known element:
“ Any help?
RavC357
@RavC357
Hi guys, I have a really annoying issue related to implementing material tools and can't work out what is going wrong, any help would be much appreciated!
so i installed material, cdk and browseranimation, imported them in my app.module.ts file but whenever I try to use a tool like <mat-form-field> in the html the dashboard compiles but the browser returns the following error:
Error: Template parse errors: 'mat-form-field' is not a known element
spent more time than i'd care to admit on this issue... xD
kwilliams-curago
@kwilliams-curago
@RavC357 make sure you import MatInputModule
RavC357
@RavC357
@kwilliams-curago Yup, i have imported that
@kwilliams-curago I think i have the issue narrowed down to the index.html file potentially causing the issue but i have no idea how to go about fixing it xD
Michael Prentice
@Splaktar
Just a reminder that this chat channel is for AngularJS Material (i.e. md-toolbar and md-button). All Angular Material questions (related to things like mat-toolbar or <button mat-button></button>) should be posted to https://gitter.im/angular/material2
Narendra
@NarenShalem
hi
friends
can you suggest angular material time picker
Toni
@SpeedoPasanen
@NarenShalem hi, i suggest angular material time picker
Anupam Basu
@nupy_21_twitter
has anybody tried multiple lines (ngfor) of mat-autocomplete?
Rémy
@remyblancke
Someone to help me with stripe & angular ? got this error with pipe ' The pipe 'stripe' could not be found '