一. HTML

  HTML中比较多逻辑代码,修改的时候要注意修改很多绑值的地方。

<div class="form-group">
<label class="col-lg-3 control-label">组织权限</label>
<div ng-init="enablePids = [];disablePids = [];">
<div class="col-lg-6" style="min-height:200px;margin-top:10px;margin-bottom:10px;">
<div class="col-sm-5" style="padding-left: 0px">
<select multiple="multiple" size="12"
style="min-width:150px; height:200px;background-color:#fff; " class="form-control"
ng-options="id as (privilegeNameFromId(id)) for id in removeArray(uiTemplateData.privilege_ids, entity.privilege)"
ng-model="disablePids"
name="unSelectedPrivilegeForOrganization"
ng-dblclick="entity.privilege =
entity.privilege.concat(disablePids);disablePids = []">
</select>
</div>
<div class="col-sm-2">
<br/><br/>
<button class="btn btn-default"
ng-click="entity.privilege =
entity.privilege.concat(disablePids);disablePids = []">>>
</button>
<br/><br/><br/>
<button class="btn btn-default"
ng-click="entity.privilege =
removeArray(entity.privilege, enablePids);enablePids = []"><<
</button>
</div>
<div class="col-sm-5" style="padding-right: 0px">
<select style="min-width:150px; height:200px; background-color:#fff;" class="form-control"
multiple="multiple"
size=12
name="SelectedPrivilegeForOrganization"
ng-options="id as (privilegeNameFromId(id)) for id in entity.privilege"
ng-model="enablePids"
ng-dblclick="entity.privilege =
removeArray(entity.privilege, enablePids);enablePids = []">
</select>
<input name="hasSelectedPrivilegeForOrganization"
ng-model="hasSelectedPrivilegeForOrganization" required ng-show="false">
<ul class="parsley-errors-list filled"
ng-show="form.hasSelectedPrivilegeForOrganization.$invalid
&& (form.unSelectedPrivilegeForOrganization.$dirty
|| form.SelectedPrivilegeForOrganization.$dirty || vertified)">
<li class="parsley-required">不能为空</li>
</ul>
</div>
</div>
</div>
</div>

二. JS

  1. 先给出绑值的ngModel

$scope.entity = {
privilege: []
}

  2. 显示值得ngModel

$scope.uiTemplateData = {
privileges: [],
privilege_ids: [],
}

  3. 主要处理逻辑

    (1)先发API请求数据回来后加到存值的地方。

    (2)处理显示出来的Name

    (3)该插件处理值只操作ID

function requestPrivilegeList(){
if (!isEditState){
DS.privilegeList({limit:2000, index:1}).then(function () {
var privileges = DS.data.unpermissions;
$scope.uiTemplateData.privileges = privileges;
var privilege_ids = [];
for (var index in privileges) {
var privilege = privileges[index];
privilege_ids.push(privilege.value);
}
$scope.uiTemplateData.privilege_ids = privilege_ids;
})
}
}
requestPrivilegeList();
$scope.privilegeNameFromId = function (id) {
var array = $scope.uiTemplateData.privileges;
for (index in array) {
var privilege = array[index];
if (privilege.value === id) {
return privilege.display_value;
}
}
return "Unknown";
}
$scope.removeArray = function (originalArray, removedArray) {
var resultArray = [];
for (var i = 0, k = 0; i < originalArray.length; i++) {
var finded = false;
var value = originalArray[i];
var length = removedArray === undefined ? 0 : removedArray.length;
for (k = 0; k < length; k++) {
if (value === removedArray[k]) {
finded = true;
break;
}
}
if (!finded) {
resultArray.push(originalArray[i]);
}
}
return resultArray;
}
$scope.hasSelectedPrivilegeForOrganization = 'true';
$scope.$watch('entity.privilege', function() {
var ids = $scope.entity.privilege;
if (ids && ids.length > 0) {
$scope.hasSelectedPrivilegeForOrganization = 'true';
return;
}
$scope.hasSelectedPrivilegeForOrganization = '';
})

最新文章

  1. Android中如何使用命令行查看内嵌数据库SQLite3
  2. 关于case语句中声明变量并初始化的注意事项
  3. 使用css3做钟表
  4. pythonchallenge 解谜 Level 8
  5. Lambda表达式公共拼接函数(原创)
  6. 后台向前台传递entity的list然后构筑combobox的方法(easyui)
  7. 如何解决WebkitBrowser使用出错“Failed to initialize activation context”
  8. SQL Server R2 2008中的SQL Server Management Studio 阻止保存要求重新创建表的更改问题的设置方法
  9. coding
  10. perl正则表达式第二周笔记
  11. Android杂谈--ListView之BaseAdapter的使用
  12. 浅谈ssh(struts,spring,hibernate三大框架)整合的意义及其精髓
  13. 用Date.ToString()输出中英文月份
  14. 网站压力测试ab 命令
  15. Matlab绘图基础——axis设置坐标轴取值范围
  16. 深入Java虚拟机(1)——Java体系结构
  17. Math对象中比较常用的计算数学相关的三个方法
  18. luogu1706全排列
  19. 前端 ----关于DOM的操作的相关实例
  20. Selenium简单测试页面加载速度的性能(Page loading performance)

热门文章

  1. 数学 Codeforces Round #219 (Div. 2) B. Making Sequences is Fun
  2. 【Python-2.7】删除空格
  3. grunt 全局使用
  4. QT 杂记
  5. 新安装数据库sqlserver2008r2,使用javaweb连接不上问题处理
  6. 写给新手的十一条 Docker 守则
  7. wpf mvvm模式下 在ViewModel关闭view
  8. 母牛的故事(hdoj 2018,动态规划递推,详解)
  9. Linux 安装 JDK 详解
  10. Oracle 常用目录结构(10g)