ng-clickへのng-model値の受け渡しに失敗しました

Question

ng-modelの値をng-clickに渡すにはどうすればいいですか？

<div ng-controller="TodoCtrl"> 
    <input type="text" ng-model="username"> 
    <button class="btn-primary" type="submit" ng-click="submit(username)">submit</button> 
</div> 

なぜ私のサブミット機能でユーザー名の値が得られないのですか？

http://jsfiddle.net/U3pVM/26604/

Answer 1

あなたng-app属性の欠落declerationがあります。これを試してみてください：

<div ng-app='myApp'> 

また、あなたの関数名と引数のタイプミス修正：

$scope.submit = function(username){ 
    alert(username) 
    } 

Answer 2

があなたのコードの下

にはエラーがありますが、固定コード

を見つけますHTML

<div ng-app="myApp"> 
    <div ng-controller="TodoCtrl"> 
     <input type="text" ng-model="username"> 
     <button class="btn-primary" type="submit" ng-click="submit(username)">submit</button> 
    </div> 
</div> 

CONTROLLER

var app = angular.module('myApp', []); 
app.controller('TodoCtrl', function($scope) { 
    $scope.submit = function(username){ 
     alert(userame) //get username here 
    } 
}); 

Answer 3

があなたのフィドルにエラーがある

あなたは$のscope.submit後の括弧（）を使用しているとして

$scope.submit = function(username){ 
    alert(username) //get username here 
    } 

の下にあなたの提出方法を更新してください関数の宣言が無効です。

も

<div ng-app="myApp"> 

のようにNG-アプリに名前を与えると警告の内部で適切に、あなたは変数名に間違いのスペルを行っている変数名を与えます。ここで

Answer 4

は正解です：

はalertで「ユーザー名」を修正し、また、メソッドを定義することは$scope.submit = function() { }

var app = angular.module('myApp', []); 
app.controller('TodoCtrl', function($scope) { 
    $scope.submit = function(username){ 
    alert(username) //get username here 
    } 
}); 

paranthesisを使うべきではありませんしながら、また、あなたは、HTMLでモジュール名を指定してあります。

<div ng-app='myApp'> 
    <div ng-controller="TodoCtrl"> 
     <input type="text" ng-model="username"> 
      <button class="btn-primary" type="submit" ng-click="submit(username)">submit</button> 
    </div> 
</div> 

Answer 5

パラメータをユーザーの関数に渡す必要はありません。関数内の$ scope.usernameからユーザー名の値を取得できます。

Answer 6

ミスやスペルミスがあります。ここで

var app = angular.module('myApp', []); 
 
app.controller('TodoCtrl', function($scope) { 
 
    $scope.submit = function(username){ 
 
    \t alert(username) //get username here 
 
    console.log("username", username) 
 
    } 
 
});

<div ng-app ="myApp"> 
 
    <div ng-controller="TodoCtrl"> 
 
     <input type="text" ng-model="username"> 
 
      <button class="btn-primary" type="submit" ng-click="submit(username)">submit</button> 
 
    </div> 
 
</div> 
 

 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script>

更新Demo

Answer 7

は、これはあなたの条件の一例です。alert()に値を送信するスニペットでテストしてみてください。

var app = angular.module("myApp",[]); 
 
app.controller("myCtrl",function($scope){ 
 
$scope.submit = function(mymdl){ 
 
    alert(mymdl); 
 
} 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="myCtrl"> 
 
<input type="text" ng-model="mymdl"/> 
 
    <button ng-click="submit(mymdl)">Submit</button> 
 
</div>