Angular material multi select get selected value on hide
0
Scenario :
- I have a filter in angular material multi-select
Todo :
I want to get the selected values on hide of dropdown..
I googled and tried to find the doc but could not found any ref to add
hide event to miltiselect
angular angular-material material-design multi-select
asked Nov 13 '18 at 7:05
Md. Parvez AlamMd. Parvez Alam
1,86621336
add a comment |
0
Scenario :
- I have a filter in angular material multi-select
Todo :
I want to get the selected values on hide of dropdown..
I googled and tried to find the doc but could not found any ref to add
hide event to miltiselect
angular angular-material material-design multi-select
asked Nov 13 '18 at 7:05
Md. Parvez AlamMd. Parvez Alam
1,86621336
can you please add more details on what you're trying to achieve? or include a stackblitz sample of your code?
– Roj
Nov 13 '18 at 7:36
add a comment |
0
0
0
Scenario :
- I have a filter in angular material multi-select
Todo :
I want to get the selected values on hide of dropdown..
I googled and tried to find the doc but could not found any ref to add
hide event to miltiselect
angular angular-material material-design multi-select
asked Nov 13 '18 at 7:05
Md. Parvez AlamMd. Parvez Alam
1,86621336
Scenario :
- I have a filter in angular material multi-select
Todo :
I want to get the selected values on hide of dropdown..
I googled and tried to find the doc but could not found any ref to add
hide event to miltiselect
angular angular-material material-design multi-select
angular angular-material material-design multi-select
asked Nov 13 '18 at 7:05
Md. Parvez AlamMd. Parvez Alam
1,86621336
asked Nov 13 '18 at 7:05
Md. Parvez AlamMd. Parvez Alam
1,86621336
edited Nov 13 '18 at 10:00
Md. Parvez Alam
asked Nov 13 '18 at 7:05
Md. Parvez AlamMd. Parvez Alam
1,86621336
asked Nov 13 '18 at 7:05
Md. Parvez AlamMd. Parvez Alam
1,86621336
asked Nov 13 '18 at 7:05
Md. Parvez AlamMd. Parvez Alam
1,86621336
1,86621336
can you please add more details on what you're trying to achieve? or include a stackblitz sample of your code?
– Roj
Nov 13 '18 at 7:36
add a comment |
can you please add more details on what you're trying to achieve? or include a stackblitz sample of your code?
– Roj
Nov 13 '18 at 7:36
can you please add more details on what you're trying to achieve? or include a stackblitz sample of your code?
– Roj
Nov 13 '18 at 7:36
can you please add more details on what you're trying to achieve? or include a stackblitz sample of your code?
– Roj
Nov 13 '18 at 7:36
add a comment |
1 Answer
1
active
oldest
votes
1
Demo where multi-select values are available after closed mat-select dropdown
Application Code : https://stackblitz.com/edit/angular-values-access-after-dropdown-close?file=src/app/app.component.html
Approach :
- Keep a variable to store
multi-selectvalues.
UseopenedChangeevent as(openedChange)="comboChange($event)", and in that store the selected values into an array or a different variable.
Event value isfalseif dropdown is closed, so i have used it in the demo code. - Also,
mat-selectis used with[formControl]="toppings", so in any other method, you can access its value usingthis.toppings.value, it will return an array with selected values.
answered Nov 13 '18 at 8:58
Abhishek KumarAbhishek Kumar
1,069216
I want when dropdown hide, not when selection made
– Md. Parvez Alam
Nov 13 '18 at 9:03
then you can use directly, asthis.toppings.value, if done according[formControl]="toppings", there are only 2 event emitters format-select, one isopenedChange, and other isselectionChange, Use any to get the value.
– Abhishek Kumar
Nov 13 '18 at 9:05
Could you please update the link, I don't understand u, I want hide event to be fired
– Md. Parvez Alam
Nov 13 '18 at 9:06
Give me a minute, i wil update the answer with other event emitter.
– Abhishek Kumar
Nov 13 '18 at 9:07
@Md.ParvezAlam please check the updated demo code and answer.
– Abhishek Kumar
Nov 13 '18 at 9:19
|
show 2 more comments
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53275566%2fangular-material-multi-select-get-selected-value-on-hide%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
1
Demo where multi-select values are available after closed mat-select dropdown
Application Code : https://stackblitz.com/edit/angular-values-access-after-dropdown-close?file=src/app/app.component.html
Approach :
- Keep a variable to store
multi-selectvalues.
UseopenedChangeevent as(openedChange)="comboChange($event)", and in that store the selected values into an array or a different variable.
Event value isfalseif dropdown is closed, so i have used it in the demo code. - Also,
mat-selectis used with[formControl]="toppings", so in any other method, you can access its value usingthis.toppings.value, it will return an array with selected values.
answered Nov 13 '18 at 8:58
Abhishek KumarAbhishek Kumar
1,069216
I want when dropdown hide, not when selection made
– Md. Parvez Alam
Nov 13 '18 at 9:03
then you can use directly, asthis.toppings.value, if done according[formControl]="toppings", there are only 2 event emitters format-select, one isopenedChange, and other isselectionChange, Use any to get the value.
– Abhishek Kumar
Nov 13 '18 at 9:05
Could you please update the link, I don't understand u, I want hide event to be fired
– Md. Parvez Alam
Nov 13 '18 at 9:06
Give me a minute, i wil update the answer with other event emitter.
– Abhishek Kumar
Nov 13 '18 at 9:07
@Md.ParvezAlam please check the updated demo code and answer.
– Abhishek Kumar
Nov 13 '18 at 9:19
|
show 2 more comments
1
Demo where multi-select values are available after closed mat-select dropdown
Application Code : https://stackblitz.com/edit/angular-values-access-after-dropdown-close?file=src/app/app.component.html
Approach :
- Keep a variable to store
multi-selectvalues.
UseopenedChangeevent as(openedChange)="comboChange($event)", and in that store the selected values into an array or a different variable.
Event value isfalseif dropdown is closed, so i have used it in the demo code. - Also,
mat-selectis used with[formControl]="toppings", so in any other method, you can access its value usingthis.toppings.value, it will return an array with selected values.
answered Nov 13 '18 at 8:58
Abhishek KumarAbhishek Kumar
1,069216
I want when dropdown hide, not when selection made
– Md. Parvez Alam
Nov 13 '18 at 9:03
then you can use directly, asthis.toppings.value, if done according[formControl]="toppings", there are only 2 event emitters format-select, one isopenedChange, and other isselectionChange, Use any to get the value.
– Abhishek Kumar
Nov 13 '18 at 9:05
Could you please update the link, I don't understand u, I want hide event to be fired
– Md. Parvez Alam
Nov 13 '18 at 9:06
Give me a minute, i wil update the answer with other event emitter.
– Abhishek Kumar
Nov 13 '18 at 9:07
@Md.ParvezAlam please check the updated demo code and answer.
– Abhishek Kumar
Nov 13 '18 at 9:19
|
show 2 more comments
1
1
1
Demo where multi-select values are available after closed mat-select dropdown
Application Code : https://stackblitz.com/edit/angular-values-access-after-dropdown-close?file=src/app/app.component.html
Approach :
- Keep a variable to store
multi-selectvalues.
UseopenedChangeevent as(openedChange)="comboChange($event)", and in that store the selected values into an array or a different variable.
Event value isfalseif dropdown is closed, so i have used it in the demo code. - Also,
mat-selectis used with[formControl]="toppings", so in any other method, you can access its value usingthis.toppings.value, it will return an array with selected values.
answered Nov 13 '18 at 8:58
Abhishek KumarAbhishek Kumar
1,069216
Demo where multi-select values are available after closed mat-select dropdown
Application Code : https://stackblitz.com/edit/angular-values-access-after-dropdown-close?file=src/app/app.component.html
Approach :
- Keep a variable to store
multi-selectvalues.
UseopenedChangeevent as(openedChange)="comboChange($event)", and in that store the selected values into an array or a different variable.
Event value isfalseif dropdown is closed, so i have used it in the demo code. - Also,
mat-selectis used with[formControl]="toppings", so in any other method, you can access its value usingthis.toppings.value, it will return an array with selected values.
answered Nov 13 '18 at 8:58
Abhishek KumarAbhishek Kumar
1,069216
edited Nov 19 '18 at 5:34
answered Nov 13 '18 at 8:58
Abhishek KumarAbhishek Kumar
1,069216
answered Nov 13 '18 at 8:58
Abhishek KumarAbhishek Kumar
1,069216
answered Nov 13 '18 at 8:58
Abhishek KumarAbhishek Kumar
1,069216
1,069216
I want when dropdown hide, not when selection made
– Md. Parvez Alam
Nov 13 '18 at 9:03
then you can use directly, asthis.toppings.value, if done according[formControl]="toppings", there are only 2 event emitters format-select, one isopenedChange, and other isselectionChange, Use any to get the value.
– Abhishek Kumar
Nov 13 '18 at 9:05
Could you please update the link, I don't understand u, I want hide event to be fired
– Md. Parvez Alam
Nov 13 '18 at 9:06
Give me a minute, i wil update the answer with other event emitter.
– Abhishek Kumar
Nov 13 '18 at 9:07
@Md.ParvezAlam please check the updated demo code and answer.
– Abhishek Kumar
Nov 13 '18 at 9:19
|
show 2 more comments
I want when dropdown hide, not when selection made
– Md. Parvez Alam
Nov 13 '18 at 9:03
then you can use directly, asthis.toppings.value, if done according[formControl]="toppings", there are only 2 event emitters format-select, one isopenedChange, and other isselectionChange, Use any to get the value.
– Abhishek Kumar
Nov 13 '18 at 9:05
Could you please update the link, I don't understand u, I want hide event to be fired
– Md. Parvez Alam
Nov 13 '18 at 9:06
Give me a minute, i wil update the answer with other event emitter.
– Abhishek Kumar
Nov 13 '18 at 9:07
@Md.ParvezAlam please check the updated demo code and answer.
– Abhishek Kumar
Nov 13 '18 at 9:19
I want when dropdown hide, not when selection made
– Md. Parvez Alam
Nov 13 '18 at 9:03
I want when dropdown hide, not when selection made
– Md. Parvez Alam
Nov 13 '18 at 9:03
then you can use directly, as
this.toppings.value, if done according [formControl]="toppings", there are only 2 event emitters for mat-select, one is openedChange, and other is selectionChange, Use any to get the value.– Abhishek Kumar
Nov 13 '18 at 9:05
then you can use directly, as
this.toppings.value, if done according [formControl]="toppings", there are only 2 event emitters for mat-select, one is openedChange, and other is selectionChange, Use any to get the value.– Abhishek Kumar
Nov 13 '18 at 9:05
Could you please update the link, I don't understand u, I want hide event to be fired
– Md. Parvez Alam
Nov 13 '18 at 9:06
Could you please update the link, I don't understand u, I want hide event to be fired
– Md. Parvez Alam
Nov 13 '18 at 9:06
Give me a minute, i wil update the answer with other event emitter.
– Abhishek Kumar
Nov 13 '18 at 9:07
Give me a minute, i wil update the answer with other event emitter.
– Abhishek Kumar
Nov 13 '18 at 9:07
@Md.ParvezAlam please check the updated demo code and answer.
– Abhishek Kumar
Nov 13 '18 at 9:19
@Md.ParvezAlam please check the updated demo code and answer.
– Abhishek Kumar
Nov 13 '18 at 9:19
|
show 2 more comments
draft saved
draft discarded
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53275566%2fangular-material-multi-select-get-selected-value-on-hide%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
can you please add more details on what you're trying to achieve? or include a stackblitz sample of your code?
– Roj
Nov 13 '18 at 7:36