link example component angularjs playframework

angularjs - example - link href angular



Error: argumento no es una función, no está definido (15)

Usando AngularJS con Scala Play, recibo este error.

Error: Argumento ''MainCtrl'' no es una función, no está definido

Intento crear una tabla que contenga los días de la semana.

Por favor, mira mi código. Había verificado el nombre del Controlador, pero eso parece correcto. Nota: Código utilizado a partir de esta answer SO

index.scala.html

@(message: String) @main("inTime") { <!doctype html> <html lang="en" ng-app> <head> <link rel="stylesheet" media="screen" href="@routes.Assets.at("stylesheets/main.css")"> </head> <div ng-controller="MainCtrl"> <table border="1"> <tbody ng-repeat=''(what,items) in data''> <tr ng-repeat=''item in items''> <td ngm-if="$first" rowspan="{{items.length}}">{{what}}</td> <td>{{item}}</td> </tr> </tbody> </table> </div> </html> }

MainCtrl.js

(function() { angular.module(''[myApp]'', []).controller(''MainCtrl'', function($scope) { $scope.data = { Colors: ["Monday", "Tuesday", "Wednesday", "Thursday", "Friday"] } }); }());


¿Podría ser tan simple como adjuntar su activo en "" y lo que necesite citas en el interior con ''''?

<link rel="stylesheet" media="screen" href="@routes.Assets.at("stylesheets/main.css")">

se convierte

<link rel="stylesheet" media="screen" href="@routes.Assets.at(''stylesheets/main.css'')">

Eso podría estar causando algunos problemas con el análisis


Algunas veces este error es el resultado de dos directivas ng-app especificadas en el html. En mi caso, por error, había especificado ng-app en mi etiqueta html y ng-app="myApp" en la etiqueta body como esta:

<html ng-app> <body ng-app="myApp"></body> </html>


El segundo punto de Уmed fue mi trampa, pero solo para el registro, tal vez es ayudar a alguien en alguna parte:

Tuve el mismo problema y justo antes de volverme loco descubrí que había olvidado incluir mi script de controlador.

Como mi aplicación se basa en ASP.Net MVC, decidí mantenerme sano insertando el siguiente fragmento en mi App_Start / BundleConfig.cs

bundles.Add(new ScriptBundle("~/app").Include( "~/app/app.js", "~/app/controllers/*.js", "~/app/services/*.js" ));

y en Layout.cshtml

<head> ... @Scripts.Render("~/app") ... </head>

Ahora no tendré que pensar en incluir los archivos manualmente nunca más. En retrospectiva, realmente debería haber hecho esto al configurar el proyecto ...


Elimine [] del nombre ([myApp]) del módulo

angular.module(''myApp'', [])

Y agregue ng-app="myApp" al html y debería funcionar.


En mi caso (que tiene una página de resumen y una página de "agregar"), obtuve esto con mi configuración de enrutamiento, como la siguiente. Estaba dando el mensaje para el AddCtrl que no pudo ser inyectado ...

$routeProvider. when(''/'', { redirectTo: ''/overview'' }). when(''/overview'', { templateUrl: ''partials/overview.html'', controller: ''OverviewCtrl'' }). when(''/add'', { templateUrl: ''partials/add.html'', controller: ''AddCtrl'' }). otherwise({ redirectTo: ''/overview'' });

Debido a la ruta when(''/'' todas mis rutas fueron a la vista general y el controlador no se pudo emparejar en la representación de la página / route route. Esto era confuso porque vi la plantilla add.html pero su controlador no estaba en ninguna parte. encontró.

Eliminando la ruta ''/'' - cuando el caso solucionó este problema para mí.


En mi caso, fue un error simple en index.html :

<script src="assets/javascript/controllers/questionssIndexController.js"></script>

eso debería haber sido

<script src="assets/javascript/controllers/questionsIndexController.js"></script>

sin los extra s en el nombre del controlador.


Esto en serio me tomó 4 HORAS (incluyendo búsquedas interminables en SO) pero finalmente lo encontré: por error (involuntariamente) agregué un espacio en alguna parte.

¿Puedes distinguirlo?

angular.module(''bwshopper.signup'').controller(''SignupCtrl '', SignupCtrl);

Entonces ... 4 horas después vi que debería ser:

angular.module(''bwshopper.signup'').controller(''SignupCtrl'', SignupCtrl);

Casi imposible de ver a simple vista.

Esto enfatiza la importancia vital del control de revisión (git o lo que sea) y las pruebas de unidad / regresión.


He encontrado el mismo problema y en mi caso estaba sucediendo como resultado de este problema:

Hice que los controladores se definieran en un módulo separado (llamado ''myApp.controllers'') y se inyectaran al módulo de la aplicación principal (llamado ''myApp'') de esta manera:

angular.module(''myApp'', [''myApp.controllers''])

Un colega empujó otro módulo de controlador en un archivo separado pero con exactamente el mismo nombre que el mío (es decir, ''myApp.controllers'') que causó este error. Creo que porque Angular se confundió entre esos módulos de controlador. Sin embargo, el mensaje de error no fue muy útil para descubrir lo que está pasando mal.


Obtuve un buen error con LoginController, que utilicé en index.html principal. Encontré dos formas de resolver:

  1. estableciendo $ controllerProvider.allowGlobals (), encontré ese comentario en Angular change-list "esta opción puede ser útil para migrar aplicaciones antiguas, ¡pero por favor no lo use en las nuevas!" comentario original en Angular

    app.config ([''$ controllerProvider'', function ($ controllerProvider) {$ controllerProvider.allowGlobals ();}]);

  2. constructora incorrecta de registrar el controlador

antes de

LoginController.$inject = [''$rootScope'', ''$scope'', ''$location''];

ahora

app.controller(''LoginController'', [''$rootScope'', ''$scope'', ''$location'', LoginController]);

''app'' viene de app.js

var MyApp = {}; var app = angular.module(''MyApp '', [''app.services'']); var services = angular.module(''app.services'', [''ngResource'', ''ngCookies'', ''ngAnimate'', ''ngRoute'']);


Para solucionar este problema, tuve que descubrir que escribí mal el nombre del controlador en la declaración de rutas angulares:

.when(''/todo'',{ templateUrl: ''partials/todo.html'', controller: ''TodoCtrl'' })


Resulta que es el caché del navegador, usando Chrome aquí. Simplemente verifique "Desactivar caché" en Inspeccionar (Elemento) resolvió mi problema.


Si está en un submódulo, no olvide declarar el módulo en la aplicación principal. es decir:

<scrip> angular.module(''mainApp'', [''subModule1'', ''subModule2'']); angular.module(''subModule1'') .controller(''MyController'', [''$scope'', function($scope) { $scope.moduleName = ''subModule1''; }]); </script> ... <div ng-app="mainApp"> <div ng-controller="MyController"> <span ng-bind="moduleName"></span> </div>

Si no declara subModule1 en mainApp, obtendrá un "[ng: areq] Argumento" MyController "no es una función, no está definido.


Tuve el mismo error con un gran error:

appFormid.controller(''TreeEditStepControlsCtrl'', [$scope, function($scope){ }]);

Lo ves ? Olvidé el "alrededor del primer $ scope", la sintaxis correcta es, por supuesto:

appFormid.controller(''TreeEditStepControlsCtrl'', [''$scope'', function($scope){ }]);

Un primer error que no vi inmediatamente fue: " $ scope no está definido ", seguido de " Error: [ng: areq] Argumento ''TreeEditStepControlsCtrl'' no es una función, no está definido "


Tuve el mismo mensaje de error (en mi caso: "Argument ''languageSelectorCtrl'' no es una función, no está definido").

Después de una tediosa comparación con el código de Angular seed, descubrí que había eliminado una referencia al módulo de controladores en app.js. (ubíquelo en https://github.com/angular/angular-seed/blob/master/app/js/app.js )

Entonces tuve esto:

angular.module(''MyApp'', [''MyApp.filters'', ''MyApp.services'', ''MyApp.directives''])

Esto falló

Y cuando agregué la referencia faltante:

angular.module(''MyApp'', [''MyApp.filters'', ''MyApp.services'', ''MyApp.controllers'', ''MyApp.directives''])

El mensaje de error desapareció y Angular pudo volver a instanciar los controladores.


PRIMERO. compruebe si tiene el controller correcto en las definiciones de ruta, igual que los nombres de controlador que está definiendo

communityMod.config([''$routeProvider'', function($routeProvider) { $routeProvider. when(''/members'', { templateUrl: ''modules/community/views/members.html'', controller: ''CommunityMembersCtrl'' }). otherwise({ redirectTo: ''/members'' }); }]); communityMod.controller(''CommunityMembersCtrl'', [''$scope'', function ($scope) { $scope.name = ''Hello community''; }]);

diferentes nombres de controlador en este ejemplo conducirán a errores, pero este ejemplo es correcto

SEGUNDO cheque si ha importado su archivo javascript:

<script src="modules/community/controllers/CommunityMembersCtrl.js"></script>