c# - Uncaught Error when loading page -
c# - Uncaught Error when loading page -
i( have mvc 5 application using angularjs , boot strap. when page loads modal doesnt launch , next err in console:
uncaught error: [$injector:modulerr] http://errors.angularjs.org/1.2.8/$injector/modulerr?p0=myapp&p1=error%3a%2….c%20(http%3a%2f%2flocalhost%3a60248%2fscripts%2fangular.min.js%3a17%3a431)
here html:
layout:
<!doctype html> <html ng-app ="myapp"> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>temujin @viewbag.title</title> <link href="~/content/bootstrap.min.css" rel="stylesheet" type="text/css" /> <link href="~/content/site.css" rel="stylesheet" type="text/css" /> <script src="~/scripts/modernizr-2.6.2.js"></script> <script src="~/scripts/jquery-1.10.2.min.js"></script> <script src="~/scripts/bootstrap.min.js"></script> <script src="~/scripts/angular.min.js"></script> <script src="~/js/login.js"></script> </head> <body> <div class="navbar navbar-inverse navbar-fixed-top"> <div class="container"> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> @html.actionlink("temujin", "index", "home", null, new { @class = "navbar-brand" }) </div> <div class="navbar-collapse collapse"> <ul class="nav navbar-nav"> </ul> </div> </div> </div> <div class="container body-content"> @renderbody() <hr /> <footer> <p>© @datetime.now.year - temujin</p> </footer> </div> </body> </html>
directive template:
<div class="modal fade"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> <h4 class="modal-title"></h4> </div> <div class="modal-body"> <form class="form-signin" name="authform" ng-submit="auth()" ng-controller ="authcontroller" novalidate> <input type="text" class="form-control" placeholder="user name" ng-model ="authcontroller.user.username" required autofocus> <input type="password" class="form-control" placeholder="password" ng-model ="authcontroller.user.password" required> <input type="submit" class="btn btn-primary" value="submit" /> </form> </div> </div><!-- /.modal-content --> </div><!-- /.modal-dialog --> </div><!-- /.modal -->
cshtml:
@{ viewbag.title = "login"; layout = "~/views/shared/_layout.cshtml"; } <h2></h2> <div id="loginbox"> <auth-modal></auth-modal> </div>
angularjs:
(function () { var temujin = angular.module('temujin', []); temujin.controller('authmodalcontroller', ['$scope',function ($scope) { $scope.temujin.user = {}; console.log("authmodalcontroller ran"); $scope.$(".modal").modal({ message: 'hell0 world' }); }]); temujin.directive("authmodal", function () { homecoming { restrict: 'e', templateurl: '\\js\\templates\\auth-modal.html', controller: 'authmodalcontroller',controlleras: 'authmodalctrl'} }); temujin.controller('authcontroller',['$scope',function ($scope) { $scope.user = {}; console.log("authcontroller ran"); $scope.auth = function () { console.log("user " + this.user); }; }]); })();
mvc 5 controller:
using system; using system.collections.generic; using system.linq; using system.web; using system.web.mvc; namespace temujin.controllers { public class temujincontroller : controller { // // get: /temujin/ public actionresult index() { homecoming view(); } } }
you attempting utilize module myapp
in page here:
<html ng-app ="myapp">
but actual module named temujin
you need alter ng-app
directive point right module name.
<html ng-app ="temujin">
c# asp.net-mvc angularjs
Comments
Post a Comment