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>