Eu procurei por uma pergunta semelhante, mas as que surgiram parecem um pouco diferentes. Estou tentando alterar dinamicamente o ui-sref = '' de um link (esse link aponta para a próxima seção de um formulário do assistente e a próxima seção depende da seleção feita na lista suspensa). Estou simplesmente tentando definir o atributo ui-sref, dependendo de alguma seleção em uma caixa de seleção. Eu sou capaz de alterar o ui-sref vinculando a um atributo de escopo que é definido quando uma seleção é feita. no entanto, o link não funciona, isso é possível? obrigado

  <a ui-sref="form.{{url}}" >Next Section</a>

e depois no meu controlador, eu defino o parâmetro url dessa maneira

switch (option) {
  case 'A': {
    $scope.url = 'sectionA';
  } break;
  case 'B': {
    $scope.url = 'sectionB';
  } break;
}

Como alternativa, usei diretivas para fazê-lo funcionar, gerando o hiperlink com o atributo ui-sref desejado, de acordo com a opção selecionada na caixa de seleção (lista suspensa).

No entanto, isso significa que eu tenho que recriar o link cada vez que uma opção diferente é selecionada na caixa de seleção, o que causa um efeito de oscilação indesejável. Minha pergunta é: é possível alterar o valor do ui-sref como tentei acima, alterando o valor da url no meu controlador ou preciso recriar todo o elemento usando uma diretiva sempre que uma seleção é feito como eu fiz abaixo? (apenas mostrando isso para completar)

Diretiva de opção de seleção (essa diretiva gera a diretiva de link)

define(['app/js/modules/app', 'app/js/directives/hyperLink'], function (app) {
app.directive('selectUsage', function ($compile) {

    function createLink(scope,element) {
        var newElm = angular.element('<hyper-link></hyper-link>');
        var el = $(element).find('.navLink');
        $(el).html(newElm);
        $compile(newElm)(scope);
    }

    return {

        restrict: 'E',
        templateUrl: '/Client/app/templates/directives/select.html'

        ,link: function (scope, element, attrs) {

            createLink(scope, element);

            element.on('change', function () {
                createLink(scope,element);
            })
        }
    }
})

Diretiva Hyperlink

define(['app/js/modules/app'], function (app) {
app.directive('hyperLink', function () {

    return {
        restrict: 'E',
        templateUrl: '/Client/app/templates/directives/hyperLink.html',
        link: function (scope, element, attrs) { }
    }

})

Modelo de hiperlink

<div>
    <button ui-sref="form.{url}}">Next Section</button>
</div>