FrameWork/AngularJS

여기 입력하는 내용은 id 라는 이름의 모델로 지정을 하고반드시 입력을 해야 한다는 의미임 입력은 안하면 false뭔가 입력을 하면 true $valid 는 유효한지 여부 이걸 이용해서 뭔가 작업을 할수 있어 이렇게 코딩하면 뭔가를 입력하라고 알림을 줄수 있어 ( from 밑에 p 요소는 true / false 확인하려고 둔 것 ) 입력은 안하면 입력하라고 뜨고 뭔가 입력을 하면 사라짐 이렇게 ng-disabled 해주면 버튼이 비 활성화 가 됌 false 로 바꾸면 버튼이 동작함 false 인 상태로 가입을 누르면 뭔가 알림창이 뜨는데 이건 angular 가 해주는 것이 아니라 html5를 지원해주는 웹브라우저가 해주는 것임 이게 뜨면 혼돈이 오기 때문에 from 에 novalidate 해주면 저 알림..
step04_showHide 하나 만들어서 1234567891011121314151617Step04_showHide.html보이게 할지 여부 숨길지 여부 Colored by Color Scriptercs 이렇게 코딩해 주고 img 경로에 맞게 적당한 그림을 넣어 주면 isShow 가 false 이니 안보이고isHide 가 false 이니 보이는 것 isShow 가 true 이니 보이는 것이고isHide 가 true 이니 안보이는 것 isShow 가 true 이니 보이는 것이고isHide 가 false 이니 보이는 것.
Step03_class 만들어 bootstrap css와 js 파일들가져와서 옮겨놔 ng-class 라는 것이 있어 true 면 addclass, false 면 removeclass 가 되는 것임 지금은 true 니까 btn-primary 가 들어 간 것임 false 로 바꿔주면 primary 가 안들어 간 것을 확인 가능 이걸 isChecked로 바꿔 준다면?? checkbox 를 클릭함에 따라서 변경되게 할수 있음 특정 시점에서 addclass, removeclass 바꿔 줄수 있는 것임 Angular 에서 특정 클래스 조종을 하려면 ng-class 를 사용하는 것 ! Step03_class2 만들어 모듈 설정을 해주고 테이블에 컨트롤러 작성을 해줘 ajax 라고 받아온 데이터라고 가정한 것을 테이블..
Step02_controller2 만들고 input 요소에 뭔가를 적고 추가를 누르면 li에 추가가 되게 하고 싶어 msg 라는 모델을 만들고 빈 배열을 생성을 해 이렇게 해주면 페이지가 처음 생성되는 시점에 뿌려 질거야 이렇게 출력이 됌 ng-modle="msg" 해준것이 $scope.msg 라고 알려주는 것임 이렇게 하면 들어가긴 하는데 똑같은걸 여러번 넣으면 안들어감 그래서 object 로 바꿔 줄 것임 이렇게 object로 바꿔주면 여러번도 들어감 이제 모두 삭제하는 것을 해 볼거야 모두삭제 버튼을 누르면 빈 배열로 만들어 버리는 것임 입력창 초기화 하는 것도 추가 $scope.msg 는 컨트롤러 안에 모델을 가르킴 추가할걸 입력하고 추가 버튼을 누르면 input 창이 초기화 됌 모두 삭제를 누르..
Step02_controller 만들어 myApp과 Ctrl1 이라고 이름을 2개 지어 준것 이름지어준 것이니 마음대로 바꿔도 됨 이름지은 2개를 여기다가 각각 적어줘 하나의 모듈에 여러개의 컨트롤러를 둘수도 있고 각각의 컨트롤러를 따로 관리를 할 수가 있어 일단 하나를 만들어보고 하나 더 추가해 볼것임 scope는 Angular 에서 관리하는 변수임 이렇게 해서 출력을 해보면 이렇게 출력이 됌 ( 빨간색 코드는 Jquery 로 했을때의 예 ) name 라는 모델에다가 김구라를 넣은 것임 이렇게 컨트롤러를 하나 더 추가해 보면 이렇게 출력이 되는 것을 확인가능하다 myApp 이라는 모듈을 만들고 컨트롤러를 여러개 찍어낼수 있는 것이다. 이렇게 clicked 라는 함수를 만들어 주면 밑에서 clicked ..
Step01_click.html 만들어서 html 안에서 일어나는 일은 Angular 가 관리하겠다고 ng-app 을 붙여 준 것임 ng-click="msg='clicked'" 를 해주면 msg 라는 click 라는 문자열을 대입한다는 의미임 실행시켜서 보면 눌러보셈 버튼을 누르면 밑에 p요소에 clicked! 가 출력되는 것을 볼수 있음 이렇게 코딩 해주면 ng-init 는 count를 0으로 초기화 ng-click 는 클릭을 했을때 count 를 1씩 증가 시켜주는 것 실행 시켜보면 0으로 되어 있는 것을 볼수 있고 여러번 막 눌러보면 하나씩 증가 되는 것을 볼수 있다. jquery 라면 어떤 변수에다 넣고 그걸 참조를 해 str 이라는 변수에 hello 가 있는데 출력을 하고이후 시점에 str 이라..
- 광속거북이 -
'FrameWork/AngularJS' 카테고리의 글 목록 (2 Page)