AngularJS+RequireJs实现动态加载JS和页面的方案研究【下】
about.js:
[html] view plain copy 在CODE上查看代码片派生到我的代码片
define(['app'], function(app)
{
app.controller('AboutViewController',
['$scope',function($scope) {
document.getElementById("test").onclick = function(){
swal($scope.title);
}
$scope.title = "About About About About";
}
]);
});
其对应的页面内容about-view.js:
[html] view plain copy 在CODE上查看代码片派生到我的代码片
<div ng-controller="AboutViewController">
<button ui-sref="home">Home</button>
<h1>{{ title }}</h1>
<form name = "registerForm" method="post" class="form-horizontal" novalidate >
<p class="bg-warning" style = "margin-left:50px;margin-right:50px;"><i class="glyphicon glyphicon-info-sign"></i><span > <b>温馨提示:带<span style="color:red"> *</span>为必填项</b></span><span ng-show = "contractInfo.status == 'INVALID'||contractInfo.status == 'END'" ><b> </b></span></p>
<p style = "margin-left:50px;margin-right:50px;" ng-show = "contractInfo.status == 'INVALID'||contractInfo.status == 'END'"><b>已失效或终止的合同不能再修改内容!</b></p>
<p style = "margin-left:50px;margin-right:50px;" ng-show = "contractInfo.status == 'EFFECTIVE'"><b>已生效的合同只能修改部分内容!</b></p>
<div>
<div class="form-group" >
<label class="control-label col-md-2 " for = "merchantId">商户<span style="color:red"> *</span></label>
<div class="col-md-3" show-errors>
<select class="form-control" id="merchantId" name = "merchantId" ng-model="contractInfo.merchantId" ng-options="merchantNameAndId.merchantId as merchantNameAndId.merchantName for merchantNameAndId in merchantNameArray" required >
<option value="">-- 请选择 --</option>
</select>
<div class="help-block" ng-messages="registerForm.merchantId.$error" ng-if="registerForm.merchantId.$touched">
<span ng-message="required" >商户不能为空</span>
</div>
</div>
<label class="control-label col-md-2" for="contractNo">合同编号</label>
<div class="col-md-3" >
<input type="text" class="form-control" id="contractNo" name = "contractNo" ng-model="contractInfo.contractNo" >
</div>
</div>
<div class="form-group" >
<label class="control-label col-md-2" for="signDate">合同签订日期<span style="color:red"> *</span></label>
<div class="col-md-3" show-errors>
<div class="input-group" readonly= "readonly">
<input type="text" class="form-control" id="signDate" name = "signDate" ng-model="contractInfo.signDate" is-open="signDateOpened" ng-click = "signDateOpened = true" datepicker-options="dateOptions" current-text="今天" clear-text="清除" close-text="关闭" readonly ="readonly" date-format uib-datepicker-popup required>
<span class="input-group-addon" ng-click = "signDateOpened = true"><i class="glyphicon glyphicon-calendar"></i></span>
</div>
<div class="help-block" ng-messages="registerForm.signDate.$error" ng-if="registerForm.signDate.$touched">
<span ng-message="required" >合同签订日期不能为空</span>
</div>
</div>
<label class="control-label col-md-2" for="signPerson">合同签署人<span style="color:red"> *</span></label>
<div class="col-md-3" show-errors>
<input type="text" class="form-control" id="signPerson" name ="signPerson" ng-model="contractInfo.signPerson" required >
<div class="help-block" ng-messages="registerForm.signPerson.$error" ng-if="registerForm.signPerson.$touched" >
<span ng-message="required" >合同签署人不能为空</span>
</div>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-2" for="effectDate">合同生效日期<span style="color:red"> *</span></label>
<div class="col-md-3" show-errors>
<div class="input-group" >
<input type="text" class="form-control" id="effectDate" name = "effectDate" ng-model="contractInfo.effectDate" is-open="effectDateOpened" ng-click = "effectDateOpened = true" datepicker-options="dateOptions" current-text="今天" clear-text="清除" close-text="关闭" readonly ="readonly" date-format uib-datepicker-www.baiyuewang.netpopup required>
<span class="input-group-addon" ng-click = "effectDateOpened = true"><i class="glyphicon glyphicon-calendar"></i></span>
</div>
<div class="help-block" ng-messages="registerForm.effectDate.$error" ng-if="registerForm.effectDate.$touched">
<span ng-message="required" >合同生效日期不能为空</span>
</div>
</div>
<label class="control-label col-md-2" for="expiryDate">合同失效日期<span style="color:red"> *</span></label>
<div class="col-md-3" show-errors>
<div class="input-group" >
<input type="text" class="form-control" id="expiryDate" name = "expiryDate" ng-model="contractInfo.expiryDate" is-open="expiryDateOpened" ng-click = "expiryDateOpened = true" datepicker-options="dateOptions" current-text="今天" clear-text="清除" close-text="关闭" readonly ="readonly" date-format uib-datepicker-popup required>
<span class="input-group-addon" ng-click = "expiryDateOpened = true"><i class="glyphicon glyphicon-calendar"></i></span>
</div>
<div class="help-block" ng-messages="registerForm.expiryDate.$error" ng-if="registerForm.expiryDate.$touched">
<span ng-message="required" >合同失效日期不能为空</span>
</div>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-2" for="autoResignFlag">到期自动续签<span style="color:red"> *</span></label>
<div class="col-md-3" show-errors>
<select class="form-control" id="autoResignFlag" name = "autoResignFlag" ng-model="contractInfo.autoResignFlag" ng-change = "changeAutoResignFlag()" ng-options="yesNo.name as yesNo.desc for yesNo in YesNoArray" required >
</select>
<div class="help-block" ng-messages="registerForm.autoResignFlag.$error" ng-if="registerForm.autoResignFlag.$touched">
<span ng-message="required" >到期自动续签不能为空</span>
</div>
</div>
<label class="control-label col-md-2" for="autoResignYears">自动续签期限</label>
<div class="col-md-3" >
<input type="text" class="form-control" id="autoResignYears" name = "autoResignYears" ng-model="contractInfo.autoResignYears" placeholder = "单位为月" >
<div class="help-block" ng-messages="registerForm.autoResignYears.$error" ng-if="registerForm.autoResignYears.$touched">
<span ng-message="required" >自动续签期限不能为空</span>
</div>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-2" for="fundTyps">涉及款项列表</label>
<div class="col-md-3" >
<input type="text" class="form-control" id="fundTyps" name = "fundTyps" ng-model="contractInfo.fundTyps" >
</div>
<label class="control-label col-md-2" for="specialInstallReq">有特殊分期要求<span style="color:red"> *</span></label>
<div class="col-md-3" show-errors>
<select class="form-control" id="specialInstallReq" name = "specialInstallReq" ng-model="contractInfo.specialInstallReq" ng-options="yesNo.name as yesNo.desc for yesNo in YesNoArray" required>
</select>
<div class="help-block" ng-messages="registerForm.specialInstallReq.$error" ng-if="registerForm.specialInstallReq.$touched">
<span ng-message="required" >特殊分期要求不能为空</span>
</div>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-2" for="remark">备注</label>
<div class="col-md-8">
<textarea class="form-control" cols="4" id="remark" name="remark" ng-model="contractInfo.remark" rows="2" style = "resize: none;"></textarea>
</div>
</div>
<div class="form-group" style = "text-align:center">
<button class="btn btn-primary" type="button" ng-click="okContractEdit()" ng-show = "contractEditable" >保存修改</button>
<button class="btn btn-warning" type="button" ng-click="cancelContractEdit()"ng-show = "contractEditable" >取消修改</button>
</div>
</div>
<div>
</form>
</div>
AngularJS+RequireJs实现动态加载JS和页面的方案研究【下】的更多相关文章
- AngularJS+RequireJs实现动态加载JS和页面的方案研究【上】
1.入口页面 存放地址:src/main/webapp/WEB-INF/view/workflow/workflow.jsp [html] view plain copy 在CODE上查看代码片派生到 ...
- AngularJS+RequireJs实现动态加载JS和页面的方案研究【中】
3.动态加载的内容: home.js [html] view plain copy 在CODE上查看代码片派生到我的代码片 define(['app'], function(app) { app.co ...
- [AngularJS] 使用AngularAMD动态加载Controller
[AngularJS] 使用AngularAMD动态加载Controller 前言 使用AngularJS来开发Single Page Application(SPA)的时候,可以选用AngularU ...
- [AngularJS] 使用AngularCSS动态加载CSS
[AngularJS] 使用AngularCSS动态加载CSS 前言 使用AngularAMD动态加载Controller 使用AngularAMD动态加载Service 上列两篇文章里,介绍了如何如 ...
- [AngularJS] 使用AngularAMD动态加载Service
[AngularJS] 使用AngularAMD动态加载Service 前言 「使用AngularAMD动态加载Controller」:这篇文章里介绍如何使用AngularAMD来动态加载Contro ...
- 使用jQuery动态加载js脚本
动态加载Javascript是一项非常强大且有用的技术.这方面的主题在本站已经讨论了不少,我也经常会在一些个人项目上使用RequireJS和Dojo加载js.它们很强大,但有时候也会得不偿失.如果你使 ...
- 使用jQuery动态加载js脚本文件的方法
动态加载Javascript是一项非常强大且有用的技术.这方面的主题在网上已经讨论了不少,我也经常会在一些个人项目上使用RequireJS和Dojo加载js 它们很强大,但有时候也会得不偿失.如果你使 ...
- JavaScript动态加载js文件
/********************************************************************* * JavaScript动态加载js文件 * 说明: * ...
- 动态加载js和css
开发过程中经常需要动态加载js和css,今天特意总结了一下常用的方法. 1.动态加载js 方法一:动态加载js文件 // 动态加载js脚本文件 function loadScript(url) { v ...
随机推荐
- SQL Server——存储过程(Stored Procedure)、事物、触发器
存储过程(proc 或 procedure) 存储过程(Stored Procedure),计算机用语,是一组为了完成特定功能的SQL语句集,是利用SQL Server所提供的Transact-SQL ...
- localStorage注册页面A注册数据在本地储存并在B页面打开
如题目的这么一个问题, A页面代码 <!DOCTYPE html> <html lang="en"> <head> <meta chars ...
- windows phpinfo上不能找到memcache扩展 php版本5.6
我的memcache用的我是memcached-win64-1.4.4-14.zip这个版本memcache扩展库下载地址:http://windows.php.net/downloads/pecl/ ...
- 20190415 踩过的VMware那些坑,安装CentOS 7后无法连网
前言 从2018年12月解散粤储软件公司开始,到现在已经失业将近5个月了,还欠下了四五十万的债,最近决心转Java开发,学习Spring Boot,期望尽快摆脱困境.清掉欠的那些钱. 因为Spring ...
- Python+USB+Vnet+FTP传输文件开发记录
做一个Python+USB+Vnet+FTP传输文件开发记录
- try -catch-finally一些要点
try -catch-finally是处理程序异常时使用,当程序正常时,先走try然后到finally语句,不正常时:程序先走try,然后到catch里面的语句,最后到finally;从上面可以看出, ...
- 【es6】数值扩展
- 【LESS系列】三角形Mixins
又是一篇自 W3CPLUS 中转化而来的文章. 和 W3CPLUS 上的做法,在设计上最大的不同就在于,这里我用的是多个 Mixins 函数来实现. 先总结这种做法的特点: 需要额外的标签来实现,因此 ...
- fgets()函数读取键盘,去掉换行符或丢弃多余的字符
在上一遍随笔中,我们知道可以用fgets()函数来代替不安全的gets()函数.fgets函数中的第二个参数限制了读取的个数. 上篇文章也提到,fgets是会读取回车换行符的.有时候我们并不希望在字符 ...
- Hibernate 4.3 SessionFactory
Configuration configuration = new Configuration().configure(); //以下这两句就是4.3的新用法 StandardServiceRegis ...