import: directive-editable
A diretiva de 'edit inline' foi concebida para permitir que campos apresentados normalmente em listas possam ser alterados sem comprometer o layout.
A edição é realizada através de um popover, o conteudo do mesmo deve ser especificado dentro da diretiva <totvs-editable>. Por padrão deve ser informado apenas um elemento do tipo <field>. É possivel utilizar qualquer tipo disponivel para a diretiva <field>. Quando informado uma label para o <field> a mesma será utilizada como titulo para o popover.
Dentro do field exibidos é possível usar a tecla ENTER e ESC para acionar o comando Aplicar e Cancelar respectivamente.
Para correto funcionamento da diretiva não pode ser informada a propriedade value nas diretivas <totvs-list-item-info> e <totvs-page-detail-info>.
<totvs-editable> ... </totvs-editable>
| Nome | Tipo | Padrão | Descrição |
|---|---|---|---|
| value | object | - | Valor a ser exibido. Irá gerar um link para a edição. |
| placement | string | bottom | (opicional) Posição em que o editor será exibido: top | bottom | left | right | auto. |
| on-complete | function | (opicional) Função a ser chamada quando o usuário realizar a alteração do valor e confirmar a aplicação do mesmo. Quando não informada a propriedade on-complete, o valor será efetivado automaticamente quando o usuário aplicar a alteração. |
<totvs-list-item-info title="Sigla">
<totvs-editable value="{{country.acronym}}">
<totvs-field
totvs-input
class="col-md-12"
ng-model="country.acronym"
label="Sigla"
canclean>
</totvs-field>
</totvs-editable>
</totvs-list-item-info>
<totvs-page-detail-info title="Sigla">
<totvs-editable value="{{country.acronym}}">
<field
type="input"
class="col-md-12"
ng-model="country.acronym"
canclean>
<label>Sigla</label>
</field>
</totvs-editable>
</totvs-page-detail-info>
