Por que a propriedade `replace` está obsoleta nas diretivas AngularJS?

De acordo com os documentos da API , o atributo replace das diretivas é reprovado, portanto, no futuro, todas as diretivas se comportarão com o padrão atual de replace: false .

Isso remove a capacidade dos desenvolvedores de replace o elemento de uma diretiva de elemento, sem substituição aparente para essa funcionalidade.

Veja este plunk para um exemplo de como as diretivas de elemento funcionam com e sem replace: true .

Por que esse atributo útil está sendo reprovado sem substituição?

ATUALIZAR

Um dos colaboradores disse que não será removido, mas os bugs conhecidos não serão corrigidos. https://github.com/angular/angular.js/commit/eec6394a342fb92fba5270eee11c83f1d895e9fb#commitcomment-8124407

ORIGINAL

Aqui está o commit dessa alteração: https://github.com/angular/angular.js/commit/eec6394a342fb92fba5270eee11c83f1d895e9fb

O sinalizador de replace para definir diretivas que substituem o elemento no qual eles estão será removido na próxima versão angular principal. Esse recurso tem semântica difícil (por exemplo, como os atributos são mesclados) e leva a mais problemas em comparação com o que ele resolve. Além disso, com WebComponents é normal ter elementos personalizados no DOM.

Parece-me que é uma combinação de complexidade vs benefício para manter o suporte.

E, aparentemente, um motivo para o dev estar sendo usado porque eles preferem a marcação semanticamente correta a ser injetada, substituindo assim a tag de diretiva personalizada.


Leia os comentários mais abaixo nesse link e, aparentemente, muitas pessoas querem que ele fique.

Se você temer que replace: true será removido na próxima versão, você pode usar uma function postCompile para replicar o comportamento.

 /// Replace element with it's first child Utils.replaceWithChild = function(element) { var child = angular.element(element[0].firstChild); Utils.mergeAttributes(element, child); element.replaceWith(child); } /// Copy attributes from sourceElement to targetElement, merging their values if the attribute is already present Utils.mergeAttributes = function(sourceElement, targetElement) { var arr = sourceElement[0].attributes; for(var i = 0; i < arr.length; i++) { var item = arr[i]; if(!item.specified) continue; var key = item.name; var sourceVal = item.value; var targetVal = targetElement.attr(key); if(sourceVal === targetVal) continue; var newVal = targetVal === undefined ? sourceVal : sourceVal + ' ' + targetVal; targetElement.attr(key, newVal); } } angular.module('test') .directive('unwrap', function() { return { restrict: 'AE', templateUrl: 'unwrap.part.html', compile: function() { return function postCompile(scope, element, attr) { Utils.replaceWithChild(element); }; } }; }); 

Do GitHub:

Caitp – Está obsoleto porque há problemas conhecidos e muito tolos de replace: true , alguns dos quais não podem ser consertados de maneira razoável. Se você é cuidadoso e evita esses problemas, então mais poder para você, mas para o benefício de novos usuários, é mais fácil apenas dizer a eles “isso lhe dará dor de cabeça, não faça isso”.

– AngularJS Edição # 7636

replace:true é Depreciado

Do Documentos:

replace ([DEPRECADO!], será removido na próxima versão principal – ou seja, v2.0)

especifique o que o modelo deve replace. O padrão é false .

  • true – o modelo replaceá o elemento da diretiva.
  • false – o modelo replaceá o conteúdo do elemento da diretiva.

– API abrangente da diretiva AngularJS

Eu diria que é uma coisa boa que foi removida porque impede você de expor o funcionamento interno de uma diretiva (componente) para o mundo externo. Observe seu modelo como sendo um DOM de sombra e compare sua diretiva com elementos HTML normais, como um botão. Você não vê todos os tipos de classs sendo adicionados e o estilo sendo aplicado a esses elementos quando você passa o mouse ou clica nele. Está tudo “escondido” por dentro. Como o suporte para shadow DOM é um pouco limitado no momento, é uma solução alternativa, mas já permite que você seja uma prova do futuro.