Navegação entre Abas Internas

1. Navegação entre Abas Internas

Pedro Henrique de Santis
pedrodesantis

(usa Fedora)

Enviado em 14/12/2020 - 15:31h

Boa tarde,
Estou com uma dificuldade onde , preciso deixar somente um botão de ( + ) adicionar uma nova ABA . No exemplo ( print atual do projeto ) existe abas em sequências, porém na " ABA Concorrente" eu não preciso deixar uma "ABA" já como Default, e apenas o botão de ( + ) .

Aqui está o código no html de adicionar "Aba" .

<nav class="navbar">
<div style="position: absolute; font-size: 12px; margin-bottom: 50px; margin-left: -20px; width: 150px; height: 30px">
<font color="#991f36">Proposta</font>
</div>
<ul class="d-flex justify-content-between nav nav-pills" id="pills-proposta-tab" data-toggle="pill" href="#pills-proposta"
role="tab" >
<div style="margin-left: -20px"></div>
<li class="nav-item" *ngFor="let screen of propostaadd">
<a style="background-color:#FAEBD7; color: #991f36" class="nav-link {{screen.state}}" attr.id="{{screen.id}}" data-toggle="tab"
attr.href="{{screen.href}}" contentEditable="true" role="tab" attr.aria-controls="{{screen.aria}}"
aria-selected="false">{{screen.name.replace("_"," ")}}</a>
</li>
<button class="btn btn-default btn-sm" (click)="addproposta1()"><i class="fas fa-plus" style='font-size:08px'></i></button>
<button class="btn btn-default btn-sm" (click)="delete()"><i class="fas fa-trash" style='font-size:08px'></i></button>
</ul>
</nav>

No TS está assim -->

this.formaconcorrente =
[
{
name: `Concorrente 1`, id: `${window.location.pathname.split("/")[1]}_Lista_tab`, href: `#${window.location.pathname.split("/")[1]}_Lista`, aria: `${window.location.pathname.split("/")[1]}_Lista`, data: this.list1, state: 'active'
}
,

]




public addconcorrente() {
let option = `Lista${Number(this.formaconcorrente[this.formaconcorrente.length - 1].name.split("Concorrente 1")[1]) + 1}`

let mynew = {
name: 'Concorrente 2 ', //option
id: `${option}_tab`,
href: `#${option}`,
aria: `${option}`,

data: this.list2,
state: ''
}


this.formaconcorrente.push(mynew)
}


Se alguém puder me ajudar, eu ficaria muito grato.

Segue print.


  






Patrocínio

Site hospedado pelo provedor RedeHost.
Linux banner

Destaques

Artigos

Dicas

Tópicos

Top 10 do mês

Scripts