前端讲义59_AngularJS模块与控制器_angular.bootstrap(document.getelementbyid('form'),-程序员宅基地

技术标签： Angular

我们知道在HTML中使用ng-app指令，即可定义一个Module（模块）。
日常我们把应用拆分为一个个的小模块，模块之间相互依赖，这样各个功能可以非常方便重用和测试。

模块有两种：
匿名模块
<div ng-app>...</div> AngularJS可自动加载并创建AngularJS模块
命名模块
<div ng-app=" HR_emp">...</div>
此时必须调用Angular对象的module()方法来创建AngularJS模块，如下
<script>
var app = angular.module("HR_emp", []);
</script>

模块添加全局变量与常量
value（name,value）全局变量
constant(name,calue) 全局常量
<script>
app.value("empid", "C10094207");
app.value("name", "木生火");
</script>

一个模块可以包含多个控制器，模块调用controller()方法来注册控制器，可在控制器传入的函数中声明多个参数---所有在控制器内使用的对象都必须在函数参数中声明，如下：
<script>
app.controller("HRCtrl",initEmp);
function initEmp($scope,empid,name) {
$scope.name = name;
$scope.empid = empid;
};
</script>

如果一个页面包含多个模块，默认启动第一个。我们可以调用bootstrap()方法来启动指定模块。该方法需传入两个参数(DOM对象，模块名称)
DOM对象，指将哪个HTML元素启动为AngularJS应用；
模块名称，angular.module（）；方法创建模块
<div id=” div_HR_emp”>
<div ng-controller="HRCtrl">
       员工工号：<input type="text" ng-model="empid" ><p>
   </div>
</div>
<script>
   var app =angular,module(“HR_emp”,[]);
   angular.bootstrap(document.getElenmentById(“div_HR_emp”),[“HR_emp”]);
</script>
启动指定模块的方法一般放在最后，

为便于理解以上要点，演示代码如下

<html>
<head>
<meta charset="utf-8">
<script src="https://cdn.staticfile.org/angular.js/1.4.6/angular.min.js"></script>
</head>
<body>

<!-- 匿名模块 -->
<div ng-app>
	<div  ng-init="company='日善'">
		公司名称：<input type="text" ng-model="company">
	</div>
</div>
	
	
<p>
<!--命名模块-->
<div id="div_HR_emp" >
	<div ng-controller="HRCtrl">
	员工工号：<input type="text" ng-model="empid" ><p>
	员工姓名：<input type="text" ng-model="name" ><p>
	工号：{
   {empid}}
	姓名：{
   {name}}
	</div>
</div>


<script>
var app = angular.module("HR_emp" , []); 
	app.value("empid", "C10094207");
	app.value("name", "木生火");
	app.controller("HRCtrl",initEmp);
	function initEmp($scope,empid,name) {
    $scope.name = name;
	$scope.empid = empid;
    };
angular.bootstrap(document.getElementById("div_HR_emp"), ["HR_emp"]);

</script>

</body>
</html>

本文链接：https://blog.csdn.net/msh2016/article/details/90743219

原作者删帖不实内容删帖广告或垃圾文章投诉

智能推荐

Android 学习之那些年我们遇到的BUG5：java.lang.IllegalArgumentException: You cannot start a load on a null Contex_you cannot start a load on a null context-程序员宅基地

在使用 Android Studio 完成《第一行代码》的第十二章中的卡片式布局样例的时候，遇到的BUG，Android Studio 上没显示错误，安装到手机上发现应用闪退，使用debug模式，在 Console 中发现报错：java.lang.IllegalArgumentException: You cannot start a load on a null Contex研究发现是Fru..._you cannot start a load on a null context

QuestionAnsweringSystem技术实现简要分析-程序员宅基地

QuestionAnsweringSystem是一个Java实现的人机问答系统，能够自动分析问题并给出候选答案。IBM人工智能计算机系统"沃森"（Watson）在2011年2月美国热门的电视智力问答节目"危险边缘"（Jeopardy！）中战胜了两位人类冠军选手，QuestionAnsweringSystem就是IBM Watson的Java开源实现。本文从系统架构、主要数据结构、关键技术及代码_questionansweringsystem

攻防世界高手区—Misc—János-the-Ripper_攻防世界 jános-the-ripper-程序员宅基地

攻防世界高手区—Misc—János-the-Ripper审题思路工具010编辑器ARCHPR下载附件解压打开发现是PK开头的文件，拉到010编辑器看一下文件开头为504B 为压缩包文件，把文件改为压缩包文件，打开发现有密码，010编辑器看一下，压缩源文件数据区和目录去的全方位标记都不为00 00，并不是伪加密，来暴力破解一下，密码显示为fish，输入密码得到flag：flag{ev3n::y0u::bru7us?!}flag为：flag{ev3n::y0u::bru7u_攻防世界 jános-the-ripper

关于(void**)及其相关的理解-程序员宅基地

关于(void**)及其相关的理解#define LOADBASSFUNCTION (f) *((void **)&f)=(void*)GetProcAddress (hBass,# f)这一句话使用*((void**)&f)的原因在于，转化目标为左值（即转化f为void*类型（*）的函数指针）。注意这里的(void**)强制类型转换仅仅只是重新声明了指针解引用的方式，

安卓手机运行ios教程_英雄联盟手游公测，安卓/苹果iOS注册下载教程！-程序员宅基地

之前英雄联盟手游内测，需要申请资格，不少小伙伴运气不太好，没有获得体验资格，现在终于等来了正式公测。目前安卓/iOS在 28 日开启公测的地区有：日本、韩国、泰国、越南、菲律宾、马来西亚、新加坡。12月首周公测地区:欧洲、中国台湾、大洋洲、越南，甚至还包括中东、北非、俄罗斯、土耳其。2021年春节公测地区：美国地区。注册方法1.无论你是安卓还是iOS，需要注册对应地区的 ID 账号(G...

pytorch 打印模型的参数值_pytorch打印模型参数-程序员宅基地

pytorch 打印模型的参数值对于简单的网络例如全连接层Linear可以使用以下方法打印linear层：fc = nn.Linear(3, 5)params = list(fc.named_parameters())print(params.__len__())print(params[0])print(params[1])输出如下：由于Linear默认是偏置bias的，..._pytorch打印模型参数

随便推点

三相电压型PWM整流器matlab设计及代码_风中旅行的博客-程序员宅基地

本文介绍了如何使用MATLAB进行三相电压型PWM整流器的设计和模拟，并提供了相关的MATLAB代码示例。在电力变流技术中，三相电压型PWM整流器（VPWM）广泛应用于高功率应用中，例如电力传输和工业控制。本文将介绍如何使用MATLAB设计三相电压型PWM整流器以及相关的代码实现。三相电压型PWM整流器正常工作时，将三相电压转换为DC电压。它的基本工作原理是通过三相桥式整流器将交流信号转换为直流信号，然后使用PWM控制器对输出进行调节。然后，PWM控制器的输出被应用于输出过滤器，以获得一个稳定的直流电压。