index Ctrl ist keine Funktion

Hey könnte jemand antworten für mich, wie es wirklich meinen Kopf ruiniert.index Ctrl ist keine Funktion

Ich erhalte einen Fehler, der besagt, dass der Controller keine Funktion ist und definiert wurde. Jetzt verstehe ich das, aber ich kann wirklich nicht sehen warum.

<!DOCTYPE html> 
<html ng-app="kachicode"> 
    <head lang="en"> 
    <meta charset="UTF-8"> 
    <title>AngularJs Gmail</title> 
    <script src="node_modules/angular/angular.js"></script> 
    <script src="routeCtrl.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.3.1/angular-ui-router.min.js"></script> 
    <script src="node_modules/angular-route/angular-route.js"></script> 
    <script src="app/config/route.js"></script> 
    </head> 
    <body id="backImg"> 
    <div ui-view></div> 
    </body> 
</html>

Das ist also meine Seite und das Routing funktioniert gut. Im Grunde genommen mein Problem ist in der routeCtrl.js Datei sagen, die Funktion nicht definiert ist:

var app = angular.module('kachicode', []); 
app.controller('indexCtrl', function indexCtrl($scope){ 
    $scope.greeting ="hey seam"; 
    $scope.goTo = function() { 
     console.log("clicking"); 
    } 
});

Das ist meine Heimat-Datei, die in dem uiview

<div ng-controller="indexCtrl as ctrl"> 

{{ctrl.greeting}} 


</div> 




angular.module('kachicode', ['ui.router']) 


.config(function ($stateProvider, $urlRouterProvider){ 

    'use strict'; 


    $urlRouterProvider.otherwise("/"); 

    $stateProvider 

     .state('home', { 

      url: '/', 
      templateUrl: 'home.html' 



     }) 


     .state('about', { 

      url: '/about', 
      templateUrl: 'kachicode/about.html' 

     }) 

     .state('contact', { 

      url: '/contact', 
      templateUrl: 'kachicode/contact.html' 


     }); 


});

dies ist mein Weg Datei

geladen wird

Ok nein jetzt. Ich habe überprüft, ob ich die Datei korrekt lade und sicherstelle, dass sie an den Kachicode angehängt ist, der in ng-app = "kachicode" definiert ist. Dies sind die häufigsten Gründe für dieses Problem, wie in den Stackoverflow-Foren, aber meine funktioniert immer noch nicht. Könnte mir jemand helfen und ich werde für immer mehr wissen, wie ich es beheben kann?

Vielen Dank

Quelle

2016-08-01 Seamus O Connor

Können Sie hilft, den (relevanten) Code von der Route enthalten. js? Und warum benutzt du beide ng-route UND ui.router? – devqon

Tut mir leid, ich habe gerade gerade das getan ...... Ich habe nicht in den Controller und Controllers zu den Staaten aufgenommen, weil mein Verständnis ist das Hinzufügen des ngcontroller zum div wäre in Ordnung. –

wird Ihr Code minimiert? –

Sie Ihre Anwendung definieren zweimal, einmal in Ihrem routeCtrl.js:

var app = angular.module('kachicode', []);

Und wieder in Ihrem route.js:

angular.module('kachicode', ['ui.router'])

Entfernen Sie entweder die zweiten Parameter von Ihrem route.js (und fügen Sie die Abhängigkeit der App Ihrer routeCtrl.js hinzu), oder ändern Sie das Setup

Die Lösung, basierend auf der Reihenfolge des Ladens Ihrer Skripte (ersten routeCtrl.js, dann route.js) tut dies in Ihrem routeCtrl.js:

var app = angular.module('kachicode', ["ui.router]);

Und dies in Ihrem route.js:

angular.module('kachicode')

Obwohl stellen Sie sicher, dass Sie in den Winkel-ui-Router laden vor Ihrem routeCtrl.js

Quelle

2016-08-01 14:42:45 devqon

Es gewann noch \ t arbeiten. Ich bekomme immer noch den Fehler nicht eine Funktion –

das ist * meistens * korrekt; Vielleicht möchten Sie expliziter über die tatsächliche Lösung sein, um Verwirrung zu vermeiden. – Claies

Siehe bearbeitete Antwort – devqon

Unten ist der empfohlene Weg, einen Controller zu definieren.

var app = angular.module('kachicode', ['ui.router']); 

//no need to write function indexCtrl() -- see below 
//also use the an array to inject you dependencies in the controller -> this syntax is good if you plan on minifying your code 

app.controller('indexCtrl', ['$scope', function($scope){ 


    $scope.greeting ="hey seam"; 

    $scope.goTo = function() { 

    console.log("clicking"); 

} 

}]);

Sie scheinen auch erstellen Sie Ihre App zweimal. In route.js, würde ich diese Zeile entfernen:

angular.module('kachicode', ['ui.router'])

und einfach tun:

app.config(function ($stateProvider, $urlRouterProvider){ 

'use strict'; 


$urlRouterProvider.otherwise("/"); 

$stateProvider 

    .state('home', { 

     url: '/', 
     templateUrl: 'home.html' 

    }) 


    .state('about', { 

     url: '/about', 
     templateUrl: 'kachicode/about.html' 

    }) 

    .state('contact', { 

     url: '/contact', 
     templateUrl: 'kachicode/contact.html' 


    }); 


});

Ich hoffe, dass Ihr Problem zu beheben

Quelle

2016-08-01 15:03:17

index Ctrl ist keine Funktion

Antwort

Verwandte Themen