Chiamare un'altra direttiva dalla direttiva con gli stessi attributi e contenuti

Question

Voglio ignorare il comportamento di una direttiva sulla biblioteca, chiamata "UI-SRef" .Vedere l'esempio:

<a ui-sref="edit" class="btn btn-small">
     <i class="icon-pencil"></i> Edit
 </a>

.

Ora, voglio creare la mia direttiva chiamata, ad esempio, "UI-SREF-APPENDE" .Il codice sarà così:

<a ui-sref-appended="edit" class="btn btn-small">
     <i class="icon-pencil"></i> Edit
 </a>

.

L'uscita che voglio deve essere:

<a ui-sref="user.edit" class="btn btn-small">
     <i class="icon-pencil"></i> Edit
 </a>

.

(e poi ha rispettato, quindi ui-sref potrebbe fare il suo lavoro)

Come posso implementarti?Il problema è che voglio il mio A per avere gli stessi attributi e contenuti, ma cambiato da UI-SREF-APPENDE="Modifica" a UI-SREF="User.edit"

Answer 1

Imposta il modello della tua nuova direttiva come segue

 template : '<a ui-sref="user.edit" class="btn btn-small"> <i class="icon-pencil"</i> Edit</a>';

.

e impostare l'utente.edit nella funzione di collegamento o superare l'utente alla direttiva tramite membro dell'ambito.

Se si dispone di un modello dinamico, è possibile creare il modello di direttiva nella funzione Link.

 app.directive('newDirective', function ($compile) {
        return {

            restrict: 'A',
            link: function (scope, element, attrs) {
            var template= '<a ui-sref="user.edit" class="{{btnClass}}"> <i class="icon-pencil"</i> Edit </a>';
element.append($compile(template)(scope));
            },
            scope: {
                user: '=',
                btnClass: '@'
            }
        }
    });

.

Modifica

Se si desidera semplicemente impostare l'UI-SREF, basta aggiungere l'UI-SREF come attributo al tuo elemento e quindi compilarlo.

 app.directive('uiSrefAppended', function ($compile) {
        return { 
            restrict: 'A',
            link: function (scope, element, attrs) {
                element.attr('ui-sref', 'user.edit');
                $compile(element)(scope);
            },
            scope: {
                user: '='
            }
        }
    });

.