Knowledge Map

angularJS에서 버튼 생성 본문

WEB/AngularJS

angularJS에서 버튼 생성

2016. 3. 31. 19:10

http://plnkr.co/edit/0Jf4qrpHAXY8MeeVA3kl?p=preview 참조


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
angular.module('plunker', ['ui.bootstrap']);
var ButtonsCtrl = function ($scope) {
 
  $scope.singleModel = 1;
 
  $scope.radioModel = 'Left';
 
  $scope.checkModel = {
    left: false,
    middle: true,
    right: false
  };
  
  $scope.toggleMode = function() {
    if ($scope.radioModel == 'Left') {
      console.log('Left clicked')
      alert($scope.radioModel);
    }
    else if ($scope.radioModel == 'Right') {
      console.log('Right clicked')
      alert($scope.radioModel);
    }
  }
};
cs


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<!doctype html>
<html ng-app="plunker">
  <head>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.10/angular.js"></script>
    <script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.11.0.js"></script>
    <script src="example.js"></script>
    <link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">
  </head>
  <body>
 
<div ng-controller="ButtonsCtrl">
    <h4>Radio &amp; Uncheckable Radio</h4>
    <pre>{{radioModel || 'null'}}</pre>
    <div class="btn-group">
        <label class="btn btn-primary" ng-model="radioModel" ng-change="toggleMode()" btn-radio="'Left'">Left</label>
        <label class="btn btn-primary" ng-model="radioModel" ng-change="toggleMode()" btn-radio="'Right'">Right</label>
    </div>
</div>
  </body>
</html>
cs



보다시피 angularjs 1.2 버전이다. 

저작자표시

'WEB > AngularJS' 카테고리의 다른 글

[$injector:unpr] Unknown provider 에러코드  (0) 2016.04.06
angularjs 윤년 처리  (0) 2016.04.01
placeholder 에 angularjs translate적용하기  (0) 2016.03.31
URL막기 / 단체 체크, 체그 해제  (0) 2016.03.29
탭  (0) 2016.03.21
공유하기 링크
'WEB/AngularJS' Related Articles more
Comments