AngularJS SPA arbeitet nicht in Web-Api Projekt

ich ein Web-api Projekt angelegt habe und danach habe ich werde einzelne Seite-Anwendung erstellen, aber einige Fehler bekommen, so dass ich meinen Code bin Entsendung unter:AngularJS SPA arbeitet nicht in Web-Api Projekt

Mein AngularJS Code:

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

app.config('$routeProvider', function ($routeProvider) { 
    $routeProvider 
     .when('/',{ 
     templateUrl: 'tpl/users.html', 
     controller: 'myController' 
    }) 
    .when('/addusers', { 
     templateUrl: 'tpl/addusers.html', 
     controller: 'addusers' 
    }) 
    .when('/admin',{ 
     templateUrl: 'tpl/admin.html', 
     controller: 'admin' 
    }); 
}); 

app.controller('myController', function ($scope) { 
    $scope.message = 'Home'; 
}); 

app.controller('admin', function ($scope) { 
    $scope.message = 'Admin'; 
}); 

app.controller('addusers', function ($scope) { 
    $scope.message = 'addusers'; 
});

und meine hTML-Seite:

<html ng-app="myApp"> 
<head> 
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular.min.js"></script> 
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular-route.js"></script> 
    <script src="app/app.js"></script> 
</head> 
<body ng-controller="myController"> 
    <a href="/">Home</a> 
    <a href="#/admin">Admin</a> 
    <a href="#/addusers">Add Users</a> 
    <br /> 
    <div ng-view> </div> 
</body> 
</html>

und unter AngularJS Fehler bekommen:

Error: [$injector:modulerr] http://errors.angularjs.org/1.2.25/$injector/modulerr?p0=myApp&p1=%5Bng%3Aareq%5D%20http%3A%2F%2Ferrors.angularjs.org%2F1.2.25%2Fng%2Fareq%3Fp0%3Dfn%26p1%3Dnot%2520a%2520function%252C%2520got%2520string%0AD%2F%3C%40http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.25%2Fangular.min.js%3A6%3A450%0ADb%40http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.25%2Fangular.min.js%3A19%3A106%0AWa%40http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.25%2Fangular.min.js%3A19%3A193%0Asc%40http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.25%2Fangular.min.js%3A32%3A423%0Ad%40http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.25%2Fangular.min.js%3A34%3A398%0Ae%2F%3C%40http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.25%2Fangular.min.js%3A33%3A386%0Ar%40http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.25%2Fangular.min.js%3A7%3A288%0Ae%40http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.25%2Fangular.min.js%3A33%3A207%0Agc%40http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.25%2Fangular.min.js%3A36%3A309%0Afc%2Fc%40http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.25%2Fangular.min.js%3A18%3A170%0Afc%40http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.25%2Fangular.min.js%3A18%3A387%0AXc%40http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.25%2Fangular.min.js%3A17%3A415%0A%40http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.25%2Fangular.min.js%3A214%3A469%0Aa%40http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.25%2Fangular.min.js%3A145%3A67%0Aoe%2Fc%2F%3C%40http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.25%2Fangular.min.js%3A31%3A223%0Ar%40http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.25%2Fangular.min.js%3A7%3A288%0Aoe%2Fc%40http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.25%2Fangular.min.js%3A31%3A207%0AEventListener.handleEvent*sb%3C%40http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.25%2Fangular.min.js%3A143%3A241%0Aa%2F%3C%40http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.25%2Fangular.min.js%3A150%3A402%0Ar%40http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.25%2Fangular.min.js%3A7%3A288%0Aa%40http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.25%2Fangular.min.js%3A149%3A381%0AS.prototype%5Bc%5D%40http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.25%2Fangular.min.js%3A154%3A57%0AS.prototype.ready%40http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.25%2Fangular.min.js%3A145%3A122%0A%40http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.25%2Fangular.min.js%3A214%3A447%0A%40http%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.25%2Fangular.min.js%3A6%3A2%0A

Quelle

2016-08-04 Samir Rawat

Ihre Controller-Definitionen (Abhängigkeitsinjektionsteile) sind falsch. Sie können die folgen john papa's style guide for angular

var app = angular.module('myApp', ['ngRoute']); 
app.config(['$routeProvider', function ($routeProvider) { 

    $routeProvider.when('/',{ 
     templateUrl: 'tpl/users.html', 
     controller: 'myController' 
    }).when('/addusers', { 
     templateUrl: 'tpl/addusers.html', 
     controller: 'addusers' 
    }).when('/admin',{ 
     templateUrl: 'tpl/admin.html', 
     controller: 'admin' 
    }); 
}]); 

app.controller('myController', ['$scope', function ($scope) { 
    $scope.message = 'Home'; 
}]); 

app.controller('admin', ['$scope', function ($scope) { 
    $scope.message = 'Admin'; 
}]); 

app.controller('addusers', ['$scope', function ($scope) { 
    $scope.message = 'addusers'; 
}]);

Quelle

2016-08-04 14:10:01 scokmen

Vielen Dank, es funktioniert gut –

@scokmen, mein Schlechter, ich versehentlich unten gewählt dies :(Ich werde es abstimmen, wenn SO lässt mich. Entschuldigung, dass. – Rob

@scokmen, es sieht aus wie Sie müssen eine Bearbeitung vor Ich kann es abstimmen. Wieder, meine Entschuldigung. – Rob

ich auf einem SPA in Winkeln mich als gut und bekam den gleichen Fehler vor kurzem

Dies ist etwas, das ich zufällig gefunden, wenn ich ngRoute wurde mit. ngRoute funktioniert, aber es scheint mir sehr unordentlich zu sein und gab mir diesen Fehler und einige andere Fehler.

Ich war wahrscheinlich nur es falsch, aber ich empfehlen Sie wechseln zu „UI-Router“

Es sollte die Art und Weise Sie Routing tun aufzuräumen und machen es einfacher Objekte in Ihrem Projekt zu handhaben.

Quelle

2016-08-04 13:54:15

Dank Richard Sussan ich es in Zukunft nutzen werden, aber was mit meinem Code falsch ist. Ich habe es mit vielen Beispielen verglichen, aber nichts falsch gemacht und den gleichen Fehler erhalten –

Also durch diesen Link sagt der Fehler "Argument 'fn' ist keine Funktion, bekam String". Ich fand [das] (http://stackoverflow.com/questions/19095129/argument-fn-is-not-a-function-got-string), das dieses Problem anspricht. Dies ist wahrscheinlich ein Fehler in einem anderen Code, den Sie in Ihrer Frage nicht angegeben haben. –

Sie verwenden die Config falsch. Sie müssen '$ routeProvider' nicht als Parameter verwenden.

Falsche

app.config('$routeProvider', function ($routeProvider) { 
});

Correct

app.config(function ($routeProvider) { 
});

Auch Angular nicht mehr verwendet ngRoute aus dem Kasten heraus. Es ist eine separate Datei (beachten Sie die Version) enthalten müssen:

https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular-route.js

Quelle

2016-08-04 14:19:39 Rob

AngularJS SPA arbeitet nicht in Web-Api Projekt

Antwort

Verwandte Themen