Error: Argumen bukan fungsi, tidak ditentukan

120

Menggunakan AngularJS dengan Scala Play, saya mendapatkan kesalahan ini.

Kesalahan: Argumen 'MainCtrl' bukan sebuah fungsi, tidak ditentukan

Saya mencoba membuat tabel yang terdiri dari hari-hari dalam seminggu.

Silakan lihat kode saya. Saya telah memeriksa nama Pengendali, tetapi tampaknya itu benar. Catatan: Kode yang digunakan dari jawaban SO ini

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"]
        }
    });
}());

angularjs playframework Kevin Meredith
sumber

15

Dalam html yang telah Anda gunakan, ng-appAnda dapat mengubahnya menjading-app=myApp

Chandermani

Mendapat kesalahan yang sama @Chandermani

Kevin Meredith

Sudahkah Anda mencoba menghapus closure (IIFE) dari kode? Ketika saya mengalami masalah ini, itu karena saya memiliki kesalahan PHP di javascript saya.

Kevin Beal

1

Anda dapat menemukan masalah Anda, melalui daftar periksa ini: stackoverflow.com/a/26797874/930170

Sergei Panfilov

Konfirmasikan apakah Anda telah menambahkan MainCtrl.controller.js ditambahkan dalam file BundleConfig.cs

Syed Mohamed

107

Hapus []dari nama ([myApp]) modul

angular.module('myApp', [])

Dan tambahkan ng-app="myApp"ke html dan itu akan berhasil.

Chandermani
sumber

1

Yang harus saya lakukan untuk membuatnya berfungsi adalah saran kedua (yaitu set ng-app = "myApp"). Jika saya menghapus [], saya mendapat kesalahan lain.

Jason

15

Memiliki parameter kedua []menunjukkan bahwa Anda membuat modul baru. Menghapus parameter kedua menunjukkan bahwa Anda mengambil modul yang ada. Jadi satu kemungkinan untuk diperiksa adalah jika Anda menelepon angular.moduledua kali, kedua kali termasuk parameter kedua. Jika demikian, kejadian selanjutnya akan menimpa yang kedua, menyembunyikan definisi pengontrol apa pun hingga saat itu.

Carl G

26

Ketika ia mengatakan untuk menghapus []dia mengacu pada parameter pertama di mana OP memiliki [myApp]bukan myApp. Dia tidak berbicara tentang parameter kedua.

Kevin Beal

1

Periksa nama pengontrol Anda jika Anda menggunakan rute. Nama pengontrol dalam definisi rute peka huruf besar / kecil.

Prajurit Latin

78

PERTAMA. periksa apakah Anda sudah benar controllerdalam definisi rute, sama dengan nama pengontrol yang Anda tentukan

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';
    }]);

nama pengontrol yang berbeda dalam contoh ini akan menyebabkan kesalahan, tetapi contoh ini benar

KEDUA periksa apakah Anda telah mengimpor file javascript Anda:

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

pleerock
sumber

30

Menurut pengalaman saya, "kedua" Anda selalu menjadi masalah. Saya sering lupa untuk mengimpor pengontrol saya keindex.html

msanford

Itu yang kedua dalam kasus saya juga, lupa mengimpor file JS ...

Saurabh Misra

26

Saya mendapat pesan kesalahan yang sama (dalam kasus saya: "Argumen 'languageSelectorCtrl' bukan fungsi, tidak dapat ditentukan").

Setelah beberapa perbandingan yang membosankan dengan kode biji Angular, saya menemukan bahwa saya sebelumnya telah menghapus referensi ke modul pengontrol di app.js. (lihat di https://github.com/angular/angular-seed/blob/master/app/js/app.js )

Jadi saya punya ini:

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

Ini gagal.

Dan ketika saya menambahkan referensi yang hilang:

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

Pesan kesalahan menghilang dan Angular dapat membuat pengontrol lagi.

bertrand
sumber

memiliki masalah yang sama, masalah saya adalah saya lupa menambahkan pengontrol saya ke modul aplikasi ... mengapa ini tidak terjadi secara otomatis ??? terima kasih bagaimanapun!

TheZuck

16

Terkadang kesalahan ini disebabkan oleh dua ng-app arahan yang ditentukan dalam html. Dalam kasus saya karena kesalahan, saya telah menentukan ng-appdi htmltag saya dan ng-app="myApp"di bodytag seperti ini:

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

Gaurav
sumber

1

Itu terjadi pada saya ketika saya tidak menambahkan injeksi ke modul myApp.

Ghandhikus

Terima kasih! Ini memperbaiki masalah saya.

bradden_gross

6

Ini benar-benar memakan waktu 4 JAM (termasuk pencarian tanpa akhir di SO) tetapi akhirnya saya menemukannya: secara tidak sengaja (tidak sengaja) saya menambahkan spasi di suatu tempat.

Bisakah kamu menemukannya?

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

Jadi ... 4 jam kemudian saya melihat bahwa seharusnya:

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

Hampir tidak mungkin untuk melihat hanya dengan mata telanjang.

Ini menekankan pentingnya kontrol revisi (git atau apa pun) dan pengujian unit / regresi.

Leo
sumber

1

Jawaban saya bukanlah ruang tambahan tetapi itu mengarahkan saya ke perbaikan saya. Saya memiliki Controlleralih-alih controllerdan hanya itu yang diperlukan.

Grandizer

Dan saya menamai file saya options-moda.controller.js tetapi mencari options-modal.controller.js DOH!

theFish

Milik saya karena saya lupa menambahkan .js di BundleConfig. Sederhana tapi membuat frustasi.

Ege Bayrak

4

Saya mengalami masalah yang sama dan dalam kasus saya itu terjadi sebagai akibat dari masalah ini:

Saya memiliki pengontrol yang ditentukan dalam modul terpisah (disebut 'myApp.controllers') dan disuntikkan ke modul aplikasi utama (disebut 'myApp') seperti ini:

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

Seorang rekan mendorong modul pengontrol lain dalam file terpisah tetapi dengan nama yang sama persis dengan milik saya (yaitu 'myApp.controllers') yang menyebabkan kesalahan ini. Saya pikir karena Angular bingung antara modul pengontrol tersebut. Namun pesan kesalahan itu tidak terlalu membantu dalam menemukan apa yang salah.

Lilla Eli
sumber

1

Ini harus diperbaiki dengan menghapus parameter kedua dalam modul ... Untuk mendapatkan modul yang ada menggunakan angular.module ('myApp') tanpa parameter kedua. yaitu angular.module ('myApp'). contoller (...)

Santhosh

3

Dalam kasus saya (memiliki halaman ikhtisar dan halaman "tambahkan") saya mendapatkannya dengan pengaturan perutean seperti di bawah ini. Itu memberikan pesan untuk AddCtrl yang tidak dapat disuntikkan ...

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

Karena when('/' rute, semua rute saya pergi ke tinjauan umum dan pengontrol tidak dapat dicocokkan pada / tambahkan rendering halaman rute. Ini membingungkan karena saya SUDAH melihat template add.html tetapi pengontrolnya tidak dapat ditemukan.

Menghapus rute '/' - saat kasus memperbaiki masalah ini untuk saya.

EeKay
sumber

Saya menerima kesalahan ini juga dan merobek rambut saya karena itu menyebabkan build TFS saya gagal. Mengomentari rute '/' juga memperbaikinya untuk saya. Sekarang untuk mencari tahu mengapa!

Phillip Copley

3

Jika Anda berada di dalam sebuah submodule, jangan lupa untuk mendeklarasikan modul tersebut di aplikasi utama. yaitu:

<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>

Jika Anda tidak mendeklarasikan subModule1 di mainApp, Anda akan mendapat "[ng: areq] Argument" MyController "bukan fungsi, tidak terdefinisi.

syjust
sumber

2

Poin kedua Уmed adalah kesalahan saya tetapi hanya sebagai catatan, mungkin itu membantu seseorang di suatu tempat:

Saya memiliki masalah yang sama dan sebelum saya menjadi gila, saya menemukan bahwa saya lupa memasukkan skrip pengontrol saya.

Karena aplikasi saya didasarkan pada ASP.Net MVC, saya memutuskan untuk tetap waras dengan memasukkan cuplikan berikut di App_Start / BundleConfig.cs saya

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

dan di Layout.cshtml

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

Sekarang saya tidak perlu lagi memikirkan untuk memasukkan file secara manual. Kalau dipikir-pikir, saya seharusnya melakukan ini saat menyiapkan proyek ...

Xceno
sumber

1

Saya mendapat kesalahan yang wajar dengan LoginController, yang saya gunakan di main index.html. Saya menemukan dua cara untuk menyelesaikannya:

pengaturan $ controllerProvider.allowGlobals (), saya menemukan komentar itu di Angular change-list "opsi ini mungkin berguna untuk memigrasi aplikasi lama, tapi tolong jangan gunakan di aplikasi baru!" komentar asli di Angular

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

sebelum

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

sekarang

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

'app' berasal dari app.js

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

Dmitri Algazin
sumber

1

Saya mengalami kesalahan yang sama dengan kesalahan besar:

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

}]);

Kamu melihat ? saya lupa '' di sekitar $ scope pertama, sintaks yang benar tentu saja:

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

}]);

Kesalahan pertama yang tidak langsung saya lihat adalah: " $ scope tidak ditentukan ", diikuti dengan " Kesalahan: [ng: areq] Argumen 'TreeEditStepControlsCtrl' bukan fungsi, tidak ditentukan "

Elo
sumber

0

Mungkinkah sesederhana memasukkan aset Anda ke dalam "" dan apa pun yang membutuhkan kutipan di dalamnya dengan ''?

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

menjadi

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

Itu bisa menyebabkan beberapa masalah dengan penguraian

Jay Tom
sumber

0

Untuk memperbaiki masalah ini, saya harus menemukan bahwa saya salah mengeja nama pengontrol di deklarasi rute sudut:

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

MadPhysicist
sumber

0

Dalam kasus saya, itu adalah kesalahan ketik sederhana di index.html:

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

itu seharusnya

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

tanpa tambahan sdalam nama pengontrol.

Eddy
sumber

0

Ternyata ini adalah Cache browser, menggunakan Chrome di sini. Cukup periksa "Disable cache" di bawah Inspect (Element) memecahkan masalah saya.

Weihui Guo
sumber

0

Karena ini muncul di Google ketika mencoba menemukan jawaban untuk: "Error: Argument '' bukan fungsi, tidak ditentukan".

Ada kemungkinan Anda mencoba membuat modul yang sama dua kali.

Angular.module adalah tempat global untuk membuat, mendaftarkan, dan mengambil modul AngularJS.

Meneruskan satu argumen akan mengambil angular.Module yang ada, sedangkan melewatkan lebih dari satu argumen akan membuat angular.Module baru

Sumber: https://docs.angularjs.org/api/ng/function/angular.module#overview

Contoh:

angular.module('myApp', []) Digunakan untuk membuat modul tanpa memasukkan dependensi apa pun.

angular.module('myApp') (Tanpa argumen) digunakan untuk mendapatkan modul yang sudah ada.

MCollard
sumber

0

Tampaknya ada banyak solusi yang berfungsi yang menunjukkan kesalahan memiliki banyak penyebab sebenarnya .

Dalam kasus saya, saya belum mendeklarasikan pengontrol di app/index.html:

<scipt src="src/controllers/controller-name.controller.js"></script>

Kesalahan hilang.

Ty Conway
sumber

Error: Argumen bukan fungsi, tidak ditentukan

Jawaban: