2014-07-26 2 views
5

내가 일하고있는 이오니아 앱에 대해 AngularJS를 배우려고하고 있는데 AngularJS가 jQuery에 대해 이전에 경험했던 것을 이해하는 데 약간의 어려움을 겪고 있습니다. 프레임 워크가 아닌 DOM 조작에 중점을 둡니다.입력 또는 버튼 클릭시 컨트롤러에 입력 값 전달

나는 다음과 같은 마크 업이있는 경우 :

<label class="item-input-wrapper"> 
    <i class="icon ion-ios7-chatbubble placeholder-icon"></i> 
    <input type="text" placeholder="Send a message..."> 
</label> 
<button class="button button-clear button-positive"> 
    Send 
</button> 

어떻게 입력 또는 전송을 클릭 할 때 나는 컨트롤러의 입력 값을 전달할 수 있습니다? 나는 채팅 앱을 개발 중이다. 따라서 메시지 스레드가 자동으로 업데이트 될 수 있도록 모델 접근법이 필요하다고 생각한다.

누군가 나를 도와 주거나 적어도 올바른 방향으로 나를 가리킬 수 있습니까?

+0

[AngularJS Tutorial/10 - 이벤트 처리기] (https://docs.angularjs.org/tutorial/step_10)를 읽으셨습니까? – Sid

+0

귀하의 질문에 대한 대답 하나도 귀하에게 각도를 가르쳐주지 않습니다. jQuery에서 마이그레이션하는 것은 간단하지 않다. 난 당신이 여기에 매우 유용한 답변을 찾을거야 : http://stackoverflow.com/questions/14994391/how-do-i-think-in-angularjs-if-i-have-a-jquery-background – Shomz

답변

8

컨트롤러에 값을 전달하는 데는 몇 가지 방법이 있습니다. 다음은 가장 간단한 예입니다. 저스틴이 말했듯이, 당신은 모호한 기본을 조사해야합니다.

HTML :

<div ng-controller="MyCtrl"> 
    <input type="text" ng-model="foo" placeholder="Enter something" /> 
    <input type="button" ng-click="doSomething()" value="Send" ng-disabled="foo == null" /> 
</div> 

JS : 여기

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

function MyCtrl($scope) { 
    $scope.foo = null; 
    $scope.doSomething = function() { 
     alert("Hello, " + $scope.foo); 
    } 
} 

는 작업 fiddle

입니다 그리고 난 당신이 post 통과하는 것이 좋습니다.

-1

게시 한 다음 마크 업은보기입니다. 필요한 것은 뷰에 링크 된 컨트롤러라는 별도의 JS 스크립트를 작성하는 것입니다. 이를 수행하는 방법에 대한 기본적인 각도 튜토리얼을 살펴보고 $ scope가 Angular에서 어떻게 작동하는지 주로 살펴보십시오.

뷰에서
$scope.foo = function(input) { alert(input); }; 

, 당신은 NG 클릭으로 각도 기능을 가진 컨트롤러에 값을 전달할 수 있습니다

컨트롤러는 기능 ... 말을해야합니다.

<a ng-click="foo('this string will be passed in as the text of the alert')">click me</a> 
관련 문제