[angularJS] scope함수

Recent Posts

Recent Comments

Tags more

Archives

Today

Total

관리 메뉴

내맘대로 살기🎉

[angularJS] scope함수 본문

개발자의 길/AngularJS

[angularJS] scope함수

해림😶 2017. 4. 28. 10:00

scope함수를 사용하여 메일 중 하나를 삭제하는 기능을 만들어보자.

고급 팁: 모델에서 데이터를 지우는 동작을 생각해보는 건 중요하다. 실제 DOM과 연관된 요소를 지우는 게 아니기 때문이다. Angular는 양방향 바인딩과 콜백없이 처리한다. 우리는 데이터에 반응하는 코드를 현명하게 작성하면 된다.

- html파일 안에 어떤 식으로 코드가 작성되고, 추가되었는지 확인

var myApp = angular.module('myApp', []);

myApp.controller('MainCtrl', ['$scope',function($scope){
	
$scope.deleteEmail = function(index){ // 추가된 부분 -  scope함수를 이용하여 email을 지우는 함수를 만들었다.
		$scope.emails.messages.splice(index,1)
	};
	
}]);

myApp.controller('EmailsCtrl', ['$scope', function ($scope) {

$scope.emails = {};

$scope.emails.messages = [{
        "from": "Steve Jobs",
        "subject": "I think I'm holding my phone wrong :/",
        "sent": "2013-10-01T08:05:59Z"
    },{
        "from": "Ellie Goulding",
        "subject": "I've got Starry Eyes, lulz",
        "sent": "2013-09-21T19:45:00Z"
    },{
        "from": "Michael Stipe",
        "subject": "Everybody hurts, sometimes.",
        "sent": "2013-09-12T11:38:30Z"
    },{
        "from": "Jeremy Clarkson",
        "subject": "Think I've found the best car... In the world",
        "sent": "2013-09-03T13:15:11Z"
    }];
    
    $scope.deleteEmail = function (index) {
        $scope.emails.messages.splice(index, 1)
    };

}]);

- js파일 안에 어떻게 작성되고, 추가되었는지 확인.

*출처 : http://soomong.net/blog/2014/01/20/translation-ultimate-guide-to-learning-angularjs-in-one-day/

저작자표시

'개발자의 길 > AngularJS' 카테고리의 다른 글

[angularJS] 동적 뷰와 라우팅 (0)	2017.04.28
[angularJS] 선언적 DOM 메소드, 표현식 (0)	2017.04.28
[angularJS] 선언적 데이터 바인딩 (.. MVC 구조) (0)	2017.04.27
[angularJS] XHR/Ajax/$http 호출과 JSON 바인딩 (0)	2017.04.27
[angularJS] 양방향 데이터 바인딩 (0)	2017.04.27

공유하기 링크

페이스북
카카오스토리
트위터

'개발자의 길/AngularJS' Related Articles

Comments

내맘대로 살기🎉

[angularJS] scope함수 본문

[angularJS] scope함수

'개발자의 길 > AngularJS' 카테고리의 다른 글

티스토리툴바