angular / components

Component infrastructure and Material Design components for Angular
https://material.angular.io
MIT License
24.35k stars 6.74k forks source link

md-button-toggle-group MULTIPLE - checked not working properly #4300

Closed laurobd closed 7 years ago

laurobd commented 7 years ago

Bug, feature request, or proposal:

When I use the md-button-toggle-group MULTIPLE and I ask for the checked property, I just give me true for the first button item.

What is the expected behavior?

Give true for each button selected separetly

What is the current behavior?

Gives me true just for the first item

What are the steps to reproduce?

  import { Component, ViewChild } from '@angular/core';
  import { MdButtonToggle } from '@angular/material';
  ...
  <md-button-toggle-group multiple>
    <md-button-toggle
      *ngFor="let item of itens"    // itens > 1
      (click)="check()"
    >
      <div>
        ...
      </div>
    </md-button-toggle>
  </md-button-toggle-group>
  ...
  @ViewChild(MdButtonToggle) private mdBT: MdButtonToggle;
  check() {
        console.log(this.mdBT.checked);
  }

What is the use-case or motivation for changing an existing behavior?

I need to know if a button was checked or not

Which versions of Angular, Material, OS, browsers are affected?

@angular/core@2.4.9 @angular/material@2.0.0-beta Windows 10 Chrome

Is there anything else we should know?

willshowell commented 7 years ago

Might want to check the difference between ViewChild and ViewChildren.

Please keep GitHub issues for bug reports / feature requests. Better avenues for troubleshooting / questions are Stack Overflow, gitter, mailing list, etc.

laurobd commented 7 years ago

@willshowell I opened this issue because this problem I'm reporting looks like a bug. I can be wrong, but I had problems using ViewChild and ViewChildren as you are saying.

willshowell commented 7 years ago

Can you recreate in a plunker? http://plnkr.co/edit/o077B6uEiiIgkC0S06dd?p=preview

Because you're using ViewChild, mdBT is only ever going to be a reference to the first element matching MdButtonToggle.

laurobd commented 7 years ago

@willshowell, thanks for your help. It worked using ViewChildren. Sorry for the opened issue, you were right.

angular-automatic-lock-bot[bot] commented 5 years ago

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.