Angular JS TypeError: f non è una funzione

Sto cercando di capire perché la mia funzione di timeout sta dando un errore, limitando in tal modo la modifica del valore del modello.Angular JS TypeError: f non è una funzione

angularExample.html

<!DOCTYPE html> 
<html ng-app="Tutorial"> 
    <head> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script> 
    <script type="text/javascript" src="scripts/app.js"></script> 
    </head> 
<body ng-controller="MyController"> 
    <input type="text" ng-model="data" /> 
</body> 
</html>

app.js

(function() { 

    var app = angular.module('Tutorial', []); 
app.controller("MyController",function($scope,$timeout){ 

    $scope.data="hi"; 
    $timeout(callAtTimeout,3000); 

    var callAtTimeout=function(){$scope.data="hello";} 
}); 
})();

Errore Snapshot: enter image description here

fonte

2015-06-03 Ajay

È necessario definire callAtTimeout prima di utilizzarlo.

var callAtTimeout=function(){console.log("hi")} 
$timeout(callAtTimeout,3000);

Inizializzazioni in Javascript non sono hoisted.

fonte

2015-06-03 13:05:54 Zee

-1

È necessario definire callAtTimeout quindi utilizzarlo.

fonte

2015-06-03 13:06:05

La definizione di funzioni come var callAtTimeout = function() { ... } avviene in fase di esecuzione, non in fase di compilazione (mentre la definizione di funzioni come function callAtTimeout() { ... } è in fase di compilazione).

A causa di questo, callAtTimeout non è ancora definita in prima linea:

$timeout(callAtTimeout,3000);

O spostare la dichiarazione di callAtTimeout sopra quella linea, o modificarlo per function callAtTimeout() { ... }

fonte

2015-06-03 13:06:13 Tom

La funzione è definita come una funzione anonima, ma non assegnato alla variabile 'callAtTimeout' fino a raggiungere la linea' var callAtTimeout = function() {...} '. Se si definisce una funzione con nome essa sarà disponibile sulla prima riga nell'ambito ('function myName() {...}'). – andlrc

Lo stesso vale per le variabili: 'var a = b + 1; var b = 0; 'Entrambe le variabili' a' e 'b' sono definite nella parte superiore dell'ambito ma quando' a' è assegnato 'b' non è ancora definito, e' a' valuterà quindi a 'a = indefinito + 1' che risulterà in 'NaN' – andlrc

@ dev-null grazie per il chiarimento – Tom

Hai solo bisogno di ri-organizzare l'ordine del tuo codice, la definizione per la funzione callAtTimeout dovrebbe essere prima di usarlo. Esempio di lavoro:

(function() { 
 

 
    var app = angular.module('Tutorial', []); 
 
app.controller("MyController",function($scope,$timeout){ 
 

 
    var callAtTimeout=function(){$scope.data="hello";} 
 
    
 
    $scope.data="hi"; 
 
    $timeout(callAtTimeout,3000); 
 

 
    
 
}); 
 
})();

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<body ng-app="Tutorial" ng-controller="MyController"> 
 
    <input type="text" ng-model="data" /> 
 
</body>

fonte

2015-06-03 13:06:13 Donal

si sta definendo la funzione callAtTimeout dopo che il suo appello. Devi averlo sopra.

Working fiddle

codice di esempio:

(function() { 

    var app = angular.module('Tutorial', []); 
    app.controller("MyController", function ($scope, $timeout) { 

     var callAtTimeout = function() { 
      $scope.data = "hello"; 
     } 
     $scope.data = "hi"; 
     $timeout(callAtTimeout, 3000); 


}); })();

fonte

2015-06-03 13:06:32 V31

L'errore può verificarsi anche quando due o più dipendenze sono fuori luogo. So che la risposta è piuttosto fuori tema ma leggere questo potrebbe aiutare qualcuno.

(function() { 
'use strict'; 

angular 
    .module('app') 
    .controller('myController', myController); 

myController.$inject = ['dependency1','dependency2','dependency3']; 
/* @ngInject */ 
function myController(dependency1,dependency3,dependency2){ 

    var v = dependency2.somefunction(arg1,arg2,...);//will trigger the error because dependency 2 && 3 are misplaced. 
    //sometimes it can be difficult to see at the first look especially when you have many dependencies 
} 
})();

fonte

2016-07-06 08:39:32 antares667367

Angular JS TypeError: f non è una funzione

risposta

Problemi correlati