javascript - directivas - link angularjs directive

¿Por qué la propiedad `replace` está obsoleta en las directivas AngularJS?

Question

Según los documentos API , el atributo de replace directivas está en desuso, por lo que en el futuro, todas las directivas se comportarán con el valor predeterminado actual de replace: false .

Esto elimina la capacidad de los desarrolladores para reemplazar un elemento de la directiva de elementos, sin un reemplazo aparente para esta funcionalidad.

Consulte este plunk para ver un ejemplo de cómo funcionan las directivas de elementos con y sin replace: true .

¿Por qué este atributo útil está en desuso sin reemplazo?

Answer 1

De GitHub:

Caitp-- Está obsoleto porque hay problemas conocidos, muy tontos con el replace: true , algunos de los cuales no se pueden arreglar de manera razonable. Si tiene cuidado y evita estos problemas, entonces tendrá más poder para usted, pero para el beneficio de los nuevos usuarios, es más fácil simplemente decirles "esto le dará dolor de cabeza, no lo haga".

- AngularJS Issue # 7636

replace:true es obsoleto

De los documentos:

replace ([DEPRECATED!], se eliminará en la próxima versión principal, es decir, v2.0)

especifica qué debe reemplazar la plantilla. El valor predeterminado es false .

• true - la plantilla reemplazará el elemento de la directiva.
• false - la plantilla reemplazará el contenido del elemento de la directiva.

- API integral de AngularJS API

Answer 2

Diría que es algo bueno que se ha eliminado porque evita exponer el funcionamiento interno de una directiva (componente) al mundo exterior. Mire su plantilla como un DOM sombreado y compare su directiva con elementos HTML normales, como un botón. No verá que se agreguen todos los tipos de clases y que se aplique el estilo a esos elementos, ya sea al pasar el mouse o hacer clic en ellos. Está todo ''escondido'' dentro. Debido a que el soporte para sombra DOM está algo limitado en este momento, es una especie de solución, pero ya le permite ser a prueba en el futuro.

Answer 3

Si teme que replace: true se eliminará en la próxima versión, puede usar una función postCompile para replicar el comportamiento.

/// 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);
            };
        }
    }; 
});

Answer 4

ACTUALIZAR

Uno de los colaboradores ha dicho que no se eliminará, pero los errores conocidos no serán corregidos. https://github.com/angular/angular.js/commit/eec6394a342fb92fba5270eee11c83f1d895e9fb#commitcomment-8124407

ORIGINAL

Aquí está la confirmación de este cambio: https://github.com/angular/angular.js/commit/eec6394a342fb92fba5270eee11c83f1d895e9fb

El indicador de replace para definir directivas que reemplazan el elemento en el que están se eliminará en la siguiente versión angular principal. Esta característica tiene una semántica difícil (por ejemplo, cómo se fusionan los atributos) y conduce a más problemas en comparación con lo que resuelve. Además, con WebComponents es normal tener elementos personalizados en el DOM.

Me parece que es una combinación de complejidad y beneficio para mantener el soporte.

Y aparentemente, un desarrollador de la razón lo estaba usando porque preferían el marcado semánticamente correcto para ser inyectado, reemplazando así la etiqueta de directiva personalizada.

Lea los comentarios más abajo en ese enlace y aparentemente muchas personas quieren que se quede.