大佬教程收集整理的这篇文章主要介绍了angularjs – 设置多重选择的值isteven of angular js,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
以下html是我的多选div.
<div multi-SELEct input-model="marks" output-model="filters.marks" button-label="name" item-label="name" tick-property="ticked" SELEction-mode="multiple" Helper-elements="all none filter" on-item-click="fClick( data )" default-label="SELEct marks" max-labels="1" max-height="250px" > </div>
我知道我可以在控制器中使用$scope.marks = data.
但问题是$scope.marks是一个全局变量,我无法改变..
有没有办法在不使用输入模型的情况下在多选中设置值?
var languages = ["C#","Java","Ruby","Go","C++","Pascal","Assembly"]; //The items. var myApp = angular.module('myApp',[]); myApp.controller('MyCtrl',function($scopE) { $scope.marks = {}; for (lang in languages) { $scope.marks[lang] = { name: languages[lang],marked: false }; } $scope.marks[3].marked = true; //mark "Go" and "C++" by default. $scope.marks[4].marked = true; $scope.theMarkedOnes = function() { outp = ""; for (m in $scope.marks) { if ($scope.marks[m].marked) outp += $scope.marks[m].name + ","; } if (outp.length == 0) { return "(nonE)"; } else { return outp.substr(0,outp.length - 2); } } $scope.setMark = function(markonE) { markone.marked = !markone.marked; } })
*,*:before,*:after { Box-sizing: border-Box; } body { font-family: sans-serif; font-size: 0.7em; } ::-webkit-scrollbar { width: 7px; } ::-webkit-scrollbar-track { -webkit-Box-shadow: inset 0 0 6px rgba(0,0.3); border-radius: 10px; } ::-webkit-scrollbar-thumb { border-radius: 10px; -webkit-Box-shadow: inset 0 0 6px rgba(0,0.5); } .multiSELEctor { BACkground-color: #CCCCCc; overflow-y: scroll; width: 17em; height: 13em; border-radius: 0.7em; } .multiSELEctor .item { cursor: pointer; padding: 0.2em 0.3em 0.2em 0.0em; } .itemtrue { BACkground-color: #9999AA; } .msshow { BACkground-color: #cccccc; border-radius: 0.7em; margin-top: 1em; padding: 0.6em; width: 17em; }
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="myApp" ng-controller="MyCtrl"> <div class="multiSELEctor"> <div ng-repeat="mark in marks" class="item item{{mark.markeD}}" ng-click="setMark(mark)">{{mark.namE}}</div> </div> <div class="msshow"> <b>SELEcted:</b> {{theMarkedOnes()}}</div> </div>
以上是大佬教程为你收集整理的angularjs – 设置多重选择的值isteven of angular js全部内容,希望文章能够帮你解决angularjs – 设置多重选择的值isteven of angular js所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。