| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 1 | ||||||
| 2 | 3 | 4 | 5 | 6 | 7 | 8 |
| 9 | 10 | 11 | 12 | 13 | 14 | 15 |
| 16 | 17 | 18 | 19 | 20 | 21 | 22 |
| 23 | 24 | 25 | 26 | 27 | 28 | 29 |
| 30 | 31 |
- 테스트 이미지
- Devtools
- livereload
- test image
- Spring
- 팬톤 색상 웹
- springboot
- RGB WEB
- color site
- RGB 생성
- 새로고침
- 웹 테스트 이미지
- Today
- Total
기억은 휘발성 메모리
ANGULARJS TUTORIAL 본문
MVC 패턴
modle -> view -> controller
MODEL : DATA
VIEW : WEB PAGE
CONTROLLER : ORIGINAL DATE를 가공 (입금내용만 보고싶다.)
ng-app 은 angularjs임을 선언한다.
<!DOCTYPE html>
<html>
<head>
<title>angular2 playground</title>
<script data-require="angular.js@4.0.0" data-semver="4.0.0" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.10/angular.min.js"></script>
<script data-require="angular.js@4.0.0" data-semver="4.0.0" src="script.ts"></script>
<script data-require="angular.js@4.0.0" data-semver="4.0.0" src="system.config.js"></script>
<script data-require="angular.js@4.0.0" data-semver="4.0.0" src="tsconfig.json"></script>
<link rel="stylesheet" href="style.css" />
<script src="javascript.js"></script>
</head>
<body ng-app="" ng-init="name='Tony'"> <!--view-->
<input type="text" ng-model="name" /> <!--model-->
<p ng-bind="name" ></p>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>angular2 playground</title>
<link data-require="bootstrap@*" data-semver="4.1.1" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css"/>
<script data-require="bootstrap@*" data-semver="4.1.1" src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script data-require="angular.js@4.0.0" data-semver="4.0.0" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.10/angular.min.js"></script>
<script data-require="angular.js@4.0.0" data-semver="4.0.0" src="script.ts"></script>
<script data-require="angular.js@4.0.0" data-semver="4.0.0" src="system.config.js"></script>
<script data-require="angular.js@4.0.0" data-semver="4.0.0" src="tsconfig.json"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body ng-app="todoApp" ng-controller="todoCtrl">
<ul>
<li ng-repeat="todo in todos">
<div class="input-group mb-3">
<div class="input-group-prepend">
<div class="input-group-text">
<input type="checkbox" ng-bind="todo.completed"/>
</div>
</div>
<input type="text" class="form-control" aria-label="Text input with checkbox" />
</div>
</li>
</ul>
</body>
</html>
var app = angular.module("todoApp", []);
app.controller("todoCtrl", function($scope) {
$scope.todos = [
{
completed: false,
title: "모바일 웹 project",
start: Date.now()
},
{
completed: true,
title: "java project",
start: Date.now()
},
{
completed: false,
title: "angularJS project",
start: Date.now()
}
];
});
' Things to remember' 카테고리의 다른 글
| git & github 시작하기 (0) | 2018.07.06 |
|---|