gpt4 book ai didi

javascript - 如何将文件夹中包含的 Controller 动态绑定(bind)到angularjs中的 View

转载 作者:行者123 更新时间:2023-11-29 21:51:53 24 4
gpt4 key购买 nike

我在根目录下名为 controller 的文件夹中有一个 Controller 。我有一个 View ,我想在路线更改时附加到相应的 View 。我正在使用 angular-ui-router。

Controller /one.js

angular.module('sub',["ui.router"]).config(function($stateProvider){
$stateProvider
.state('index', {
url: "/login",
views: {
"viewA": {
templateUrl: "login.html"
}
}
})
.state('register', {
url: "/register",
views: {
"viewA": {
templateUrl: "register.html"
}
}
})
.state('upload', {
url: "/upload",
views: {
"viewA": {
templateUrl: "upload.html"
}
}
})
})

测试.html

    <!DOCTYPE html>
<html ng-app="sub">

<head>
<title>AngularJS: UI-Router Quick Start</title>
<!-- Bootstrap CSS -->
<link href="bootstrap.min.css" rel="stylesheet">
</head>

<body class="container">

<div class="navbar">
<div class="navbar-inner">
<a class="brand" ui-sref="index">Quick Start</a>
<ul class="nav">
<li><a ui-sref="index">Home</a></li>
<li><a ui-sref="register">Register</a></li>
<li><a ui-sref="upload">upload</a></li>
</ul>
</div>
</div>

<div class="row">
<div class="span6">
<div class="well" ui-view="viewA"></div>
</div>
</div>
<script type="text/javascript" src="angular.min.js"></script>
<script type="text/javascript" src="Controllers/one.js"></script>
<script type="text/javascript" src="angular-cookies.js"></script>
<script type="text/javascript" src="Controllers/loginController.js"></script>
<script type="text/javascript" src="Controllers/uploadController.js"></script>
<script type="text/javascript" src="Controllers/registerController.js"></script>
<script type="text/javascript" src="angular-ui-router.js"></script>
<script type="text/javascript" src="jquery-2.1.3.min.js"></script>
</body>

</html>

登录.html

<div ng-controller="loginController">
<p>
UserName:
<input id="director" type="text" ng-model="mUserName"/>
</p>

<p>
Password:
<input id="actor" type="text" ng-model="mPassWord"/>
</p>
<button ng-click="login()">Login</button>
</div>

Controller /LoginController.js

angular.module('subsd',["ngCookies"]).controller('loginController', ['$http','$scope','$cookies',function($http,$scope,$cookies) {})]);

如果我在 loginController.js 中提到“sub”而不是“subsd”,路由将停止工作。

最佳答案

最终的答案包括一些要做的事情:

  1. 删除 <div ng-controller="loginController">来自 login.html 模板文件。
  2. 移动'ngCookies'sub 的依赖controllers/one.js 文件 ( angular.module('sub',["ui.router", "ngCookies"]) ) 中的模块定义。
  3. controllers/logincontroller.js 文件中,将模块名称从 subsd 更改为至 sub再次返回并从 sub 中删除第二个参数模块调用,使其看起来像这样:angular.module('sub').controller(...) .

当您之前更改模块名称时,您试图重新定义它,这是一个错误。

这个

angular.module('moduleName', [...dependencies])

是模块setter,而这个

angular.module('moduleName')

是模块getter

关于javascript - 如何将文件夹中包含的 Controller 动态绑定(bind)到angularjs中的 View ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28727173/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com