cc-radio-button

CCMS radio button component

by Disciple_D

HTML

<script src="http://cdn.bootcss.com/angular.js/1.5.6/angular.js"></script>
<script src="http://cdn.bootcss.com/angular.js/1.5.6/angular-resource.js"></script>
<script src="http://cdn.bootcss.com/angular-ui-router/0.2.18/angular-ui-router.js"></script>
<script src="http://114.215.169.170:8080/dist/ccms-components.js"></script>
<link rel="stylesheet" href="http://114.215.169.170:8080/dist/ccms-components.css">
<div ng-controller="ctrl" style="padding: 20px">
<h1>Radio button Demo</h1>
<p>Support Attribute</p>
<ul style="list-style: disc">
	<li style="list-style: inside">ng-model</li>
	<li style="list-style: inside">ng-value</li>
	<li style="list-style: inside">ng-disabled</li>
</ul>

<div>
	<h2>Demo</h2>
	<p>ng-model & ng-value should be setting on every radio button component.</p>
	value: {{demo.value}}<br>
	disabled: {{demo.disabled}}<br>
	<cc-radio ng-repeat="item in demo.setting track by $index" ng-model="demo.value" ng-value="item" ng-disabled="demo.disabled">{{item}}</cc-radio>
	<cc-radio ng-model="demo.value" value="d" ng-disabled="demo.disabled">d</cc-radio>
	<button ng-click="generatorValues()">generator value</button>
	<button ng-click="demo.disabled = !demo.disabled">toggle disable</button>
</div>

JavaScript

;(function (angular, undefined) {

	'use strict';

	angular
		.module('app', ['ccms.components'])
		.controller('ctrl', function ($scope) {

			$scope.demo = {
				value: 'a',
				setting: ['a', 'b', 'c', 'd'],
				disabled: false
			};

			$scope.generatorValues = () =>{
				$scope.demo.setting = $scope.demo.setting.map(() => Math.floor(Math.random() * 10 + 1));
			};
		});

})(window.angular);