AngularJS+RequireJs实现动态加载JS和页面的方案研究【中】
3、动态加载的内容:
home.js
[html] view plain copy 在CODE上查看代码片派生到我的代码片
define(['app'], function(app)
{
app.controller('HomeViewController',
['$scope',function($scope) {
document.getElementById("test").onclick = function(){
swal($scope.title);
}
$scope.title = "Home Home Home Home";
}
]);
});
home-view.js
[html] view plain copy 在CODE上查看代码片派生到我的代码片
<div ng-controller="HomeViewController">
<button ui-sref="about">About</button>
<h1>{{ title }}</h1>
<br/>
<form name = "registerForm" id = "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></p>
<div>
<div class="form-group" style = "margin-left:50px;margin-right:-250px;">
<label class="control-label col-md-1" for="merchantName">商户名称<span style="color:red"> *</span></label>
<div class="col-md-2" show-errors>
<input type="text" class="form-control" id="merchantName" name = "merchantName" ng-model="merhantBaseInfo.merchantName" required>
<div class="help-block" ng-messages="registerForm.merchantName.$error" ng-if="registerForm.merchantName.$touched">
<span ng-message="required" >用户名不能为空</span>
</div>
</div>
<label class="control-label col-md-1" for="merchantShortName">商户简称</label>
<div class="col-md-2" >
<input type="text" class="form-control" id="merchantShortName" name ="merchantShortName" ng-model="merhantBaseInfo.merchantShortName" >
</div>
<label class="control-label col-md-1" for="type">商户类型<span style="color:red"> *</span></label>
<div class="col-md-2" show-errors>
<select class="form-control" id="type" name = "type" ng-model="merhantBaseInfo.type" ng-options="type.name as type.desc for type in MerchantTypeArray" required >
<option value="">-- 请选择 --</option>
</select>
<div class="help-block" ng-messages="registerForm.type.$error" ng-if="registerForm.type.$touched">
<span ng-message="required" >商户类型不能为空</span>
</div>
</div>
</div>
<div class="form-group" style = "margin-left:50px;margin-right:-250px;">
<label class="control-label col-md-1" for="comRegName">商户工商注册全名<span style="color:red"> *</span></label>
<div class="col-md-5" show-errors>
<input type="text" class="form-control" id="comRegName" name = "comRegName" ng-model="merhantBaseInfo.comRegName" required>
<div class="help-block" ng-messages="registerForm.comRegName.$error" ng-if="registerForm.comRegName.$touched">
<span ng-message="required" >商户注册全名不能为空</span>
</div>
</div>
<label class="control-label col-md-1" for="industry">所属行业<span style="color:red"> *</span></label>
<div class="col-md-2" show-errors>
<select class="form-control" id="industry" name = "industry" ng-model="merhantBaseInfo.industry" ng-options="industry.name as industry.desc for industry in IndustryArray" required>
<option value="">-- 请选择 --</option>
</select>
<div class="help-block" ng-messages="registerForm.industry.$error" ng-if="registerForm.industry.$touched">
<span ng-message="required" >所属行业不能为空</span>
</div>
</div>
</div>
<div class="form-group" style = "margin-left:50px;margin-right:-250px;">
<label class="control-label col-md-1" for="coopMode">合作模式<span style="color:red"> *</span></label>
<div class="col-md-2" show-errors>
<select class="form-control" id="coopMode" name = "coopMode" ng-model="merhantBaseInfo.coopMode" ng-options="coopMode.name as coopMode.desc for coopMode in CoopModeArray" required>
<option value="">-- 请选择 --</option>
</select>
<div class="help-block" ng-messages="registerForm.coopMode.$error" ng-if="registerForm.coopMode.$touched">
<span ng-message="required" >合作模式不能为空</span>
</div>
</div>
<label class="control-label col-md-1" for="baseAcctBank">基本帐户开户银行名称</label>
<div class="col-md-2">
<input type="text" class="form-control" id="baseAcctBank" name = "baseAcctBank" ng-model="merhantBaseInfo.baseAcctBank" >
</div>
<label class="control-label col-md-1" for="baseAcct">银行基本帐户账号</label>
<div class="col-md-2" >
<input type="text" class="form-control" id="baseAcct" name ="baseAcct" ng-model="merhantBaseInfo.baseAcct" >
</div>
</div>
<div class="form-group" style = "margin-left:50px;margin-right:-250px;">
<label class="control-label col-md-1" for="org">组织机构代码</label>
<div class="col-md-2" show-errors>
<input type="text" class="form-control" id="org" name = "org" ng-model="merhantBaseInfo.org" >
</div>
<label class="control-label col-md-1" for="businessLicense">营业执照</label>
<div class="col-md-2" >
<input type="text" class="form-control" id="businessLicense" name = "businessLicense" ng-model="merhantBaseInfo.businessLicense" >
</div>
<label class="control-label col-md-1" for="taxId">纳税人代码</label>
<div class="col-md-2" >
<input type="text" class="form-control" id="taxId" name = "taxId" ng-model="merhantBaseInfo.taxId" >
</div>
</div>
<div class="form-group" style = "margin-left:50px;margin-right:-250px;">
<label class="control-label col-md-1" for="officePhone">公司电话</label>
<div class="col-md-2" >
<input type="text" class="form-control" id="officePhone" name ="officePhone" ng-model="merhantBaseInfo.officePhone" >
</div>
<label class="control-label col-md-1" for="address">地址</label>
<div class="col-md-2" >
<input type="text" class="form-control" id="address" name = "address" ng-model="merhantBaseInfo.address" >
</div>
<label class="control-label col-md-1" for="websiteUrl">公司网址</label>
<div class="col-md-2" >
<input type="text" class="form-control" id="websiteUrl" name = "websiteUrl" ng-model="merhantBaseInfo.websiteUrl" >
</div>
</div>
<div class="form-group" style = "margin-left:50px;margin-right:-250px;">
<label class="control-label col-md-1" for="scale">企业规模</label>
<div class="col-md-2">
<select type="text" class="form-control" id="scale" name = "scale" ng-model="merhantBaseInfo.scale" ng-options="scale.name as scale.desc for scale in ScaleArray" >
<option value="">-- 请选择 --</option>
</select>
</div>
<label class="control-label col-md-1" for="legalPerson">企业法人</label>
<div class="col-md-2">
<input type="text" class="form-control" id="legalPerson" name = "legalPerson" ng-model="merhantBaseInfo.legalPerson" >
</div>
<label class="control-label col-md-1" for="legalPersonId">法人证件号码</label>
<div class="col-md-2">
<input type="text" class="form-control" id="legalPersonId" name = "legalPersonId" ng-model="merhantBaseInfo.legalPersonId" >
</div>
</div>
<div class="form-group" style = "margin-left:50px;margin-right:-250px;">
<label class="control-label col-md-1" for="province">合作区域<span style="color:red"> *</span></label>
<div class="col-md-2" show-errors>
<select type="text" id = "province" name = "province" class="form-control" ng-model="merhantBaseInfo.province" ng-change = "changeProvince()" ng-options="province.areaId as province.areaName for province in AllProvinceArray" required>
<option value="">---请选择---</option>
</select>
<div class="help-block" ng-messages="registerForm.province.$error" ng-if="registerForm.province.$touched">
<span ng-message="required" >合作区域不能为空</span>
</div>
</div>
<div class="col-md-2">
<select type="text" class="form-control" ng-model="merhantBaseInfo.city" ng-change="changeCity()" ng-options="city.areaId as city.areaName for city in nowCityArray">
<option value="">---请选择---</option>
</select>
</div>
<div class="col-md-2">
<select type="text" class="form-control" ng-model="merhantBaseInfo.district" ng-change="area=''" ng-options="district.areaId as district.areaName for district in nowDistrictArray">
<option value="">---请选择---</option>
</select>
</div>
</div>
<div class="form-group" style = "margin-left:50px;margin-right:-250px;">
<label class="control-label col-md-1" for="remark">备注</label>
<div class="col-md-8">
<textarea class="form-control" cols="4" id="remark" name="remark" ng-model="merhantBaseInfo.remark" rows="2" style = "resize: none;"></textarea>
</div>
</div>
</div>
<div>
</form>
</div>