Stop a primeng dropdown from showing if it has no sub dropups
I have a health care company dropdown that when selected shows a sub dropdown containing the plans
Im trying to get the the company not to show if the user has selected all the plans in it.
I also wish to auto show the plans of the company rather than selecting it first
Code: HTML
<div *ngIf="selectedCompany" class="div-gap"></div>
<div *ngIf="selectedCompany && cPlans && cPlans.length > 0" class="ui-g-12">
<div>
<p-dropdown [options]="cPlans" defaultLabel="Seleccione" [(ngModel)]="selectedPlanId">
</p-dropdown>
</div>
</div>
Code: TS
getHealthCareCompanies() {
this.healthCareCompaniesService.getAll().subscribe(result => {
this.hcCompaniesList = Util.getArraySelectItem(result, 'person.companyName');
// this.newHcCompaniesList = this.hcCompaniesList.filter(company => company.plans.length > 0);
console.log('HC',this.hcCompaniesList);
}, error => {
console.log('error')
});
}
getPlans(){
this.healthcarePlanService.getAll().subscribe(result => {
this.plansCombo = Util.getArraySelectItem(result, 'description')
console.log('Plans',this.plansCombo)
}, error => {
console.log('Error obteniendo planes.', error);
});
}
currently im cheating by just displaying a div when there is no plans, but i would prefer no company to show at all when there is no plans
i added the ts functions
angular typescript angular5 primeng
asked Nov 26 '18 at 18:36
Aidan WardAidan Ward
327
add a comment |
I have a health care company dropdown that when selected shows a sub dropdown containing the plans
Im trying to get the the company not to show if the user has selected all the plans in it.
I also wish to auto show the plans of the company rather than selecting it first
Code: HTML
<div *ngIf="selectedCompany" class="div-gap"></div>
<div *ngIf="selectedCompany && cPlans && cPlans.length > 0" class="ui-g-12">
<div>
<p-dropdown [options]="cPlans" defaultLabel="Seleccione" [(ngModel)]="selectedPlanId">
</p-dropdown>
</div>
</div>
Code: TS
getHealthCareCompanies() {
this.healthCareCompaniesService.getAll().subscribe(result => {
this.hcCompaniesList = Util.getArraySelectItem(result, 'person.companyName');
// this.newHcCompaniesList = this.hcCompaniesList.filter(company => company.plans.length > 0);
console.log('HC',this.hcCompaniesList);
}, error => {
console.log('error')
});
}
getPlans(){
this.healthcarePlanService.getAll().subscribe(result => {
this.plansCombo = Util.getArraySelectItem(result, 'description')
console.log('Plans',this.plansCombo)
}, error => {
console.log('Error obteniendo planes.', error);
});
}
currently im cheating by just displaying a div when there is no plans, but i would prefer no company to show at all when there is no plans
i added the ts functions
angular typescript angular5 primeng
asked Nov 26 '18 at 18:36
Aidan WardAidan Ward
327
Can you add some screenshots?
– gatsbyz
Nov 26 '18 at 19:39
added the screenshots buddy
– Aidan Ward
Nov 26 '18 at 19:45
add a comment |
I have a health care company dropdown that when selected shows a sub dropdown containing the plans
Im trying to get the the company not to show if the user has selected all the plans in it.
I also wish to auto show the plans of the company rather than selecting it first
Code: HTML
<div *ngIf="selectedCompany" class="div-gap"></div>
<div *ngIf="selectedCompany && cPlans && cPlans.length > 0" class="ui-g-12">
<div>
<p-dropdown [options]="cPlans" defaultLabel="Seleccione" [(ngModel)]="selectedPlanId">
</p-dropdown>
</div>
</div>
Code: TS
getHealthCareCompanies() {
this.healthCareCompaniesService.getAll().subscribe(result => {
this.hcCompaniesList = Util.getArraySelectItem(result, 'person.companyName');
// this.newHcCompaniesList = this.hcCompaniesList.filter(company => company.plans.length > 0);
console.log('HC',this.hcCompaniesList);
}, error => {
console.log('error')
});
}
getPlans(){
this.healthcarePlanService.getAll().subscribe(result => {
this.plansCombo = Util.getArraySelectItem(result, 'description')
console.log('Plans',this.plansCombo)
}, error => {
console.log('Error obteniendo planes.', error);
});
}
currently im cheating by just displaying a div when there is no plans, but i would prefer no company to show at all when there is no plans
i added the ts functions
angular typescript angular5 primeng
asked Nov 26 '18 at 18:36
Aidan WardAidan Ward
327
I have a health care company dropdown that when selected shows a sub dropdown containing the plans
Im trying to get the the company not to show if the user has selected all the plans in it.
I also wish to auto show the plans of the company rather than selecting it first
Code: HTML
<div *ngIf="selectedCompany" class="div-gap"></div>
<div *ngIf="selectedCompany && cPlans && cPlans.length > 0" class="ui-g-12">
<div>
<p-dropdown [options]="cPlans" defaultLabel="Seleccione" [(ngModel)]="selectedPlanId">
</p-dropdown>
</div>
</div>
Code: TS
getHealthCareCompanies() {
this.healthCareCompaniesService.getAll().subscribe(result => {
this.hcCompaniesList = Util.getArraySelectItem(result, 'person.companyName');
// this.newHcCompaniesList = this.hcCompaniesList.filter(company => company.plans.length > 0);
console.log('HC',this.hcCompaniesList);
}, error => {
console.log('error')
});
}
getPlans(){
this.healthcarePlanService.getAll().subscribe(result => {
this.plansCombo = Util.getArraySelectItem(result, 'description')
console.log('Plans',this.plansCombo)
}, error => {
console.log('Error obteniendo planes.', error);
});
}
currently im cheating by just displaying a div when there is no plans, but i would prefer no company to show at all when there is no plans
i added the ts functions
angular typescript angular5 primeng
angular typescript angular5 primeng
asked Nov 26 '18 at 18:36
Aidan WardAidan Ward
327
asked Nov 26 '18 at 18:36
Aidan WardAidan Ward
327
edited Nov 26 '18 at 20:55
Aidan Ward
asked Nov 26 '18 at 18:36
Aidan WardAidan Ward
327
asked Nov 26 '18 at 18:36
Aidan WardAidan Ward
327
asked Nov 26 '18 at 18:36
Aidan WardAidan Ward
327
327
Can you add some screenshots?
– gatsbyz
Nov 26 '18 at 19:39
added the screenshots buddy
– Aidan Ward
Nov 26 '18 at 19:45
add a comment |
Can you add some screenshots?
– gatsbyz
Nov 26 '18 at 19:39
added the screenshots buddy
– Aidan Ward
Nov 26 '18 at 19:45
Can you add some screenshots?
– gatsbyz
Nov 26 '18 at 19:39
Can you add some screenshots?
– gatsbyz
Nov 26 '18 at 19:39
added the screenshots buddy
– Aidan Ward
Nov 26 '18 at 19:45
added the screenshots buddy
– Aidan Ward
Nov 26 '18 at 19:45
add a comment |
1 Answer
1
active
oldest
votes
You should filter hcCompaniesList in the .ts file. Such as:
newHcCompaniesList = hcCompaniesList.filter(company => company.plans.length > 0);
-- edit
getHealthCareCompanies() {
this.healthCareCompaniesService.getAll().subscribe(result => {
this.hcCompaniesList = result.filter(company: HealthCareCompany => company.healthCarePlans);
console.log('HC',this.hcCompaniesList);
}, error => {
console.log('error')
});
}
answered Nov 26 '18 at 19:56
gatsbyzgatsbyz
220317
i have tried that previously and it didnt work
– Aidan Ward
Nov 26 '18 at 20:02
i added the functions i currently use to attain the info from the server
– Aidan Ward
Nov 26 '18 at 20:04
@AidanWard Can I see the results ofconsole.log('HC',this.hcCompaniesList);
– gatsbyz
Nov 26 '18 at 20:16
just added it dude
– Aidan Ward
Nov 26 '18 at 20:55
@AidanWard How does it look now?
– gatsbyz
Nov 26 '18 at 21:00
|
show 1 more comment
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
});
}
});
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%2f53487125%2fstop-a-primeng-dropdown-from-showing-if-it-has-no-sub-dropups%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
You should filter hcCompaniesList in the .ts file. Such as:
newHcCompaniesList = hcCompaniesList.filter(company => company.plans.length > 0);
-- edit
getHealthCareCompanies() {
this.healthCareCompaniesService.getAll().subscribe(result => {
this.hcCompaniesList = result.filter(company: HealthCareCompany => company.healthCarePlans);
console.log('HC',this.hcCompaniesList);
}, error => {
console.log('error')
});
}
answered Nov 26 '18 at 19:56
gatsbyzgatsbyz
220317
i have tried that previously and it didnt work
– Aidan Ward
Nov 26 '18 at 20:02
i added the functions i currently use to attain the info from the server
– Aidan Ward
Nov 26 '18 at 20:04
@AidanWard Can I see the results ofconsole.log('HC',this.hcCompaniesList);
– gatsbyz
Nov 26 '18 at 20:16
just added it dude
– Aidan Ward
Nov 26 '18 at 20:55
@AidanWard How does it look now?
– gatsbyz
Nov 26 '18 at 21:00
|
show 1 more comment
You should filter hcCompaniesList in the .ts file. Such as:
newHcCompaniesList = hcCompaniesList.filter(company => company.plans.length > 0);
-- edit
getHealthCareCompanies() {
this.healthCareCompaniesService.getAll().subscribe(result => {
this.hcCompaniesList = result.filter(company: HealthCareCompany => company.healthCarePlans);
console.log('HC',this.hcCompaniesList);
}, error => {
console.log('error')
});
}
answered Nov 26 '18 at 19:56
gatsbyzgatsbyz
220317
i have tried that previously and it didnt work
– Aidan Ward
Nov 26 '18 at 20:02
i added the functions i currently use to attain the info from the server
– Aidan Ward
Nov 26 '18 at 20:04
@AidanWard Can I see the results ofconsole.log('HC',this.hcCompaniesList);
– gatsbyz
Nov 26 '18 at 20:16
just added it dude
– Aidan Ward
Nov 26 '18 at 20:55
@AidanWard How does it look now?
– gatsbyz
Nov 26 '18 at 21:00
|
show 1 more comment
You should filter hcCompaniesList in the .ts file. Such as:
newHcCompaniesList = hcCompaniesList.filter(company => company.plans.length > 0);
-- edit
getHealthCareCompanies() {
this.healthCareCompaniesService.getAll().subscribe(result => {
this.hcCompaniesList = result.filter(company: HealthCareCompany => company.healthCarePlans);
console.log('HC',this.hcCompaniesList);
}, error => {
console.log('error')
});
}
answered Nov 26 '18 at 19:56
gatsbyzgatsbyz
220317
You should filter hcCompaniesList in the .ts file. Such as:
newHcCompaniesList = hcCompaniesList.filter(company => company.plans.length > 0);
-- edit
getHealthCareCompanies() {
this.healthCareCompaniesService.getAll().subscribe(result => {
this.hcCompaniesList = result.filter(company: HealthCareCompany => company.healthCarePlans);
console.log('HC',this.hcCompaniesList);
}, error => {
console.log('error')
});
}
answered Nov 26 '18 at 19:56
gatsbyzgatsbyz
220317
edited Nov 26 '18 at 21:00
answered Nov 26 '18 at 19:56
gatsbyzgatsbyz
220317
answered Nov 26 '18 at 19:56
gatsbyzgatsbyz
220317
answered Nov 26 '18 at 19:56
gatsbyzgatsbyz
220317
220317
i have tried that previously and it didnt work
– Aidan Ward
Nov 26 '18 at 20:02
i added the functions i currently use to attain the info from the server
– Aidan Ward
Nov 26 '18 at 20:04
@AidanWard Can I see the results ofconsole.log('HC',this.hcCompaniesList);
– gatsbyz
Nov 26 '18 at 20:16
just added it dude
– Aidan Ward
Nov 26 '18 at 20:55
@AidanWard How does it look now?
– gatsbyz
Nov 26 '18 at 21:00
|
show 1 more comment
i have tried that previously and it didnt work
– Aidan Ward
Nov 26 '18 at 20:02
i added the functions i currently use to attain the info from the server
– Aidan Ward
Nov 26 '18 at 20:04
@AidanWard Can I see the results ofconsole.log('HC',this.hcCompaniesList);
– gatsbyz
Nov 26 '18 at 20:16
just added it dude
– Aidan Ward
Nov 26 '18 at 20:55
@AidanWard How does it look now?
– gatsbyz
Nov 26 '18 at 21:00
i have tried that previously and it didnt work
– Aidan Ward
Nov 26 '18 at 20:02
i have tried that previously and it didnt work
– Aidan Ward
Nov 26 '18 at 20:02
i added the functions i currently use to attain the info from the server
– Aidan Ward
Nov 26 '18 at 20:04
i added the functions i currently use to attain the info from the server
– Aidan Ward
Nov 26 '18 at 20:04
@AidanWard Can I see the results of
console.log('HC',this.hcCompaniesList);– gatsbyz
Nov 26 '18 at 20:16
@AidanWard Can I see the results of
console.log('HC',this.hcCompaniesList);– gatsbyz
Nov 26 '18 at 20:16
just added it dude
– Aidan Ward
Nov 26 '18 at 20:55
just added it dude
– Aidan Ward
Nov 26 '18 at 20:55
@AidanWard How does it look now?
– gatsbyz
Nov 26 '18 at 21:00
@AidanWard How does it look now?
– gatsbyz
Nov 26 '18 at 21:00
|
show 1 more comment
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.
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%2f53487125%2fstop-a-primeng-dropdown-from-showing-if-it-has-no-sub-dropups%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 add some screenshots?
– gatsbyz
Nov 26 '18 at 19:39
added the screenshots buddy
– Aidan Ward
Nov 26 '18 at 19:45