如何在多个AngularJS脚本文件中使用相同的MVC控制器？
如何在多个AngularJS脚本文件中使用相同的MVC控制器？
提问于 2016-08-26 06:31:37
我已经创建了一个MVC项目，并添加了AngularJS-Material和所有必需的文件。我将AngularJS应用程序放在_Layout.cshtml页面上，因为我希望能够在整个项目中显示工具栏。
对于每个视图，我都计划使用不同的控制器，但是当我在新的脚本文件中引用控制器时，我得到一个错误，指出控制器未定义。
下面的代码运行良好，唯一的问题是当我试图在代码的@RenderBody()部分添加另一个视图时。在每个单独的chstml文件上，我定义了一个新的控制器，但保留了相同的应用程序。
这是我的布局文件：
<!DOCTYPE html>
<html ng-app="bPST" ng-controller="layoutCtrl">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>@ViewBag.Title - My ASP.NET Application</title>
@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/modernizr")
<link href="~/Content/angular-material.min.css" rel="stylesheet" />
<script src="~/Scripts/angular.js"></script>
<script src="~/Scripts/angular-animate.js"></script>
<script src="~/Scripts/angular-aria.js"></script>
<script src="~/Scripts/angular-messages.js"></script>
<script src="~/Scripts/angular-material/angular-material.js"></script>
<script src="~/Ang_Scripts/bpst.js"></script>
</head>
<body>
<div layout="column" layout-fill>
<md-toolbar>
<div class="md-toolbar-tools">
<span>Title </span>
<!-- fill up the space between left and right area -->
<span flex></span>
<md-button ng-click="sideBarFunctions()">Menu</md-button>
</div>
</md-toolbar>
<md-sidenav ng-cloak class="md-sidenav-left md-whitefram-z2" md-component-id="left" md-is-open="sideBarOpen">
<div layout="column" layout-align="space-around stretch">
<md-toolbar>
<h2 style="text-align: center;">Menu</h2>
</md-toolbar>
<md-content layout-padding layout="column" layout-align="start">
</md-content>
</div>
</md-sidenav>
<md-content>
<div class="container body-content">
@RenderBody()
</div>
</md-content>
</div>
<hr />
<footer>
<p>© @DateTime.Now.Year - My ASP.NET Application</p>
</footer>
@Scripts.Render("~/bundles/jquery")
@*@Scripts.Render("~/bundles/bootstrap")*@
@RenderSection("scripts", required: false)login.js：
var bApp = angular.module('bPST', ['ngMaterial']);
bApp.controller('loginCTRL',function($scope) {
$scope.message = "Login";
});回答 1
Stack Overflow用户
发布于 2016-08-26 09:20:12
所以问题更多的是我在js文件中创建应用程序的方式。
我就是这么做的。
var bPSTApp = angular.module('bPST', ['ngMaterial']);然后像这样创建控制器。
bPSTApp.controller('layoutCtrl', function ($scope) {
//Add coding here
};当我把它改成这样的时候，它开始工作了。
angular.module('bPST').controller('layoutCtrl', function ($scope) {
//Add coding here
});现在，我需要做的就是在每个控制器文件中引用App，而不是尝试引用我在主JS文件中设置的变量。
另外，因为我在login cshtml文件上使用了login.js，所以它只在该视图中被引用。
我确实知道AngularJS和AngularJS材料对于单页面应用程序很好，但是我想使用一些函数来使我的应用程序看起来很好，并以我想要的方式运行。
我喜欢新手犯的错误。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/39155745
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号