javascript - style - {{$ index}} de la repetición ng calculada después de la función del enlazador de la directiva angular. $ compilarlo?

ng-if

Question

html

<div repeater ng-repeat=''item in items'' class=''first'' id = ''{{$index}}'' > {{item}} </div>

directiva angularjs: -

angular.module(''time'', [])
  .directive(''repeater'', function() {

    var linkFn = function(scope, element, attrs){
      var id = $(element).attr(''id'');
      alert(id); // {{$index}}
    } ...

Identificación dinámica creada dentro de ng-repeat, cuando se evoca dentro de la directiva se muestra como {{$ index}} en lugar de value = 0, 1, 2 ...

¿Cómo se asegura que cuando la función Linker en la directiva ejecuta los identificadores dinámicos se utilizan? Creo que se puede hacer usando $ compile dentro de la directiva. Pero no puedo entender cómo?

$compile(element)(scope) 

es la sintaxis Pero obviamente el orden equivocado.

Answer 1

Espero que esto ayude

1. directiva

    angular.module(''time'', []).directive(''repeater'', function() {
      return{
             restrict:"E",
             scope:{
                   itemarray: "=itemarray"
                }
             template:"<div ng-repeat=''item in itemarray'' class=''first'' id = ''{{$index}}'' > {{item}} </div>",
              link:linkFn
           }
             var linkFn = function(scope, element, attrs){
            var id = $(element).attr(''id'');
            alert(id); // {{$index}}

   } ...

2. html

          <repeater itemarray=''itemarray"></repeater>

Answer 2

Si realmente necesita que los ID estén ya completos, puede ejecutar el código correspondiente dentro del scope.$evalAsync o $timeout para asegurarse de que el enlace se haya actualizado primero. Sugeriría esforzarme por evitar la necesidad de inspeccionar el DOM y confiar en su modelo para obtener esta información, utilizando scope.$index .

Su directiva ya está en proceso de ser compilada y vinculada cuando se alcanza su función de enlace, por lo que creo que recompilar no sería de ayuda. Es solo un caso de esperar el tiempo suficiente para finalizar el enlace y comenzar un $digest donde los atributos realmente se actualizarán. Esto es exactamente lo que $evalAsync hará por usted.

Ejemplo aquí: http://plnkr.co/edit/n77x4C?p=preview