参考にさせて頂いたページ
AngularJS: イベントリスナーを登録するには?(ng-clickなど) - Build Insider
index.htmlの作成とその記述内容
例として以下の通り。
<div ng-controller="SampleCtrl"> <input type="text" ng-model="name" /> <button ng-click="onclick()">送信</button> <div>{{msg}}</div> </div>
ng-app.jsの作成とその記述内容
例として以下の通り。
var SampleCtrl = function($scope) { // デフォルトの値を設定 $scope.msg = 'こんにちは、誰かさん!'; // ng-click="onclick"なので、onclickメソッドを定義 $scope.onclick = function() { $scope.msg = 'こんにちは、' + $scope.name + 'さん!'; }; }
このソースコードについて
input要素は、ng-model="name"なので、入力される値はng-app.jsの中の$scope.nameに紐付く。
button要素は、ng-click="onclick()"なので、これをクリックすると、ng-app.jsの中のonclickメソッドが実行される。
button要素がクリックされる度に、$scope.msgの値は、'こんにちは、' + $scope.name + 'さん!'
で上書きされる。