Direttive AngularJS errate - Impossibile leggere la proprietà 'compile' di undefined

Question

Da principiante a AngularJS e tentativo di creare una direttiva semplice. Il codice ha esito negativo con un errore di tipo : impossibile leggere la proprietà 'compilazione' di undefined. Ogni suggerimento sarà molto apprezzato.

JS

var xx = angular.module('myApp', []); 
xx.directive('myFoo', 
      function(){ 
       return 
       { 
        template:'23' 
       };      
}); 

HTML

<div ng-app="myApp"> 
<div my-foo></div> 
</div> 

È possibile trovare il codice e l'errore qui https://jsfiddle.net/p11qqrxx/15/

Answer 1

E 'solo la sua dichiarazione di ritorno.

Bad:

return 
{} // This returns undefined, return is odd and doesn't look at the next line 

Buono:

return{ 
} // Returns an empty object, always open your object on the same line as the return 

Meglio:

var directive = {}; 
return directive; // How I always do it, to avoid the issue. 

Answer 2

È inoltre fatto riferimento AngularJs 1.0.0 che era troppo vecchio, ho aggiornato a 1.1

Change direttiva a questo

xx.directive('myFoo', 

function() { 
    return { 
     restrict: 'A', //defaults its A no need of it to declare. 
     template: '23' 
    }; 
}); 

Working Fiddle

Answer 3

Questa non è una questione di angolare, ma è il modo javascript sintassi di ritorno sono scritti ed eseguiti. Ho creato un semplice video che illustra questo problema in modo più dettagliato. Puoi vedere questo video da questo link.

https://www.facebook.com/shivprasad.koirala/videos/910570055693818/

Ora per la lunga risposta. In javascript "return" e "return;" sono uguali e "{}" è una funzione anonima.

Quando si scrive return e "{" nella riga successiva le sue due dichiarazioni restituiscono e "{}" è una funzione anonima.Il programma ritorna dalla sintassi "return" e il codice all'interno della parentesi graffa non viene mai eseguito o possiamo dire che è un codice irraggiungibile. Quindi torna "non definito".

return // returns from this step itself 
{ 
    // any code here will never execute 
// unreachable code 
} 

Quando si scrive la parentesi graffa subito dopo il ritorno statment li tratta come un blocco di codice e anche esegue il codice all'interno della parentesi graffa.

return{ 
// any code here will execute 
} 

Quindi è tutto su dove la parentesi graffa è dopo la dichiarazione di ritorno.

Answer 4

xx.directive ('myFoo',

function() {var obje = { limitare: 'A', // default suo un no bisogno di essa per dichiarare template:. '23' return obje; } });