web-dev-qa-db-ja.com

Angular $ scopeに入力値を取得するにはどうすればよいですか？

私はAngularが初めてで、本当に基本的なことをしようとしています。ビューの一部を次に示します（すべてangularファイルは他の場所に追加されます）：

_ <div ng-controller='ctrl'>
    <input type='text' ng-model='id'>
 </div>
_

そして、ここに私のコントローラーがあります：

_ module.controller('ctrl',['$scope', function ($scope) {

    // get the scope value here
}]);
_

私がやろうとしていることは本当に簡単です。入力値を使用したい。 _$scope.data = []_や$scope.data.Push($scope.id)のようなものを試して、スコープの値を持つ配列を作成しましたが、うまくいきませんでした。値を表示しようとすると、コンソールに「未定義」が表示されました。

皆さん、何かご存知ですか？

編集：ビューには、値を取得しようとするコントローラーの機能をトリガーする_ng-click_ディレクティブを持つボタンもあります.

javascriptangularjsangularjs-scopeangularjs-ng-model
8
Arhyaa

値は$scopeに自動的に追加されますが、input要素に何かを入力する必要があります。

ただし、この値を取得するには何かをトリガーする必要があります。たとえば、コメントが// get the scope value hereの場合、これはコントローラーが初期化されて再度呼び出されるとすぐにトリガーされます。そのため、その時点では未定義のログが記録されます。ただし、ボタンクリックなどに設定すると、利用できることがわかります。

<div ng-controller='ctrl'>
   <input type='text' ng-model='id'>
   <button ng-click="logId()">Log ID</button>
</div>

そしてあなたのコントローラー：

module.controller('ctrl',['$scope', function ($scope) {
    $scope.logId = function() {
        console.log($scope.id);
    }
}]);

入力に何かを入力し、ボタンをクリックします。

15
Tom

配列で本当に必要な場合は、コントローラーで次のようにします。

$scope.data = [0];

hTMLでは<input type="text" ng-model="data[0]">

INPUTに何かを入力すると、その配列の値が自動的に入力され、idは常に配列の最初の位置になります。

または、コントローラのオブジェクトで処理できます：$scope.data = {};

hTMLで<input type="text" ng-model="data.id">

0
Tamaro Tamaroidny