2015-10-16 101 views
1

我是angularJs的新手。我有一個使用ng-repeat生成新記錄的頁面:什麼是angularJs方法將變量值傳遞迴控制器

<tr ng-repeat="obj in objs"> 
    <td> 
    <input type="text" value="{{obj.name}}" /> 
    </td> 
    <td> 
    <input type="text" value="{{obj.amount}}" /> 
    </td> 
    <td> 
    <input type="text" value="{{obj.status}}" /> 
    </td> 
</tr> 

因爲它們都是輸入字段。所有數據都可寫入客戶。提交表單時,我正在嘗試獲取更新的數據。使用下面的代碼:

$scope.submitform = function(index) { 
    var objJson = JSON.stringify($scope.objs); 
    $('input[id$="objList"]').val(objJson); 
    saveForm(); 
} 

但似乎$ scope.objs沒有更新的客戶輸入,我可以理解。但問題是,我應該如何將值傳遞迴$ scope.objs?我可以肯定地使用jQuery來做到這一點,但這可能聽起來不是很有說服力。那麼在angularJs中實現這個最好的方法是什麼?

+2

你爲什麼不使用'ngModel'? – Satpal

+0

@Satpal,因爲我還沒有學到......我正在閱讀關於它的文檔 –

+1

use 你可以在控制器中使用$ scope.inputTest –

回答

1

您應該使用ng-model而不是value

<tr ng-repeat="obj in objs"> 
    <td> 
     <input type="text" ng-model="obj.name"/> 
    </td> 
    <td> 
     <input type="text" ng-model="obj.amount"/> 
    </td> 
    <td> 
     <input type="text" ng-model="obj.status"/> 
    </td> 
</tr> 

當用戶編輯的input場這將更新$scope.objs

它的工作原理是因爲ng-model被結合input與所述ng-model屬性中指定的字段的值,並且obj僅僅是objs[$index]一個別名($index自動由角內ng-repeat提供)。

所以在這個領域input

<input type="text" ng-model="obj.name"/> 

要綁定input.value$scope.objs[$index].name

1

使用ng-model將值傳遞給控制器​​。

演示爲NG-模型

var app = angular.module('myApp', []); 
 
app.controller('myCtrl', function($scope) { 
 
    $scope.firstName = "Krupesh"; 
 
    $scope.lastName = "Kotecha"; 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="myCtrl"> 
 
    First Name: <input type="text" ng-model="firstName"><br> 
 
    Last Name: <input type="text" ng-model="lastName"><br> 
 
    <br> 
 
    Full Name: {{firstName + " " + lastName}} 
 
</div>

+0

來訪問它。謝謝你的回答。兩個答案對我都很有幫助。我點擊添加一個這個答案。但是因爲羅恩的回答更加簡潔,直接指出了我的問題,所以我選擇了他。 –

1

角具有MVVM架構。您可以將任何控制器數據綁定到視圖(即html)並訪問控制器中更改的數據。

如果您只想將數據從控制器發送到HTML,您可以使用ngBind指令。如果你想要雙向綁定,即從控制器到HTML以及從HTML到控制器,那麼使用指令ngModel。在當前場景中,您需要ngModel指令。

請參見下面的代碼:

    <tr ng-repeat="obj in objs"> 
        <td> 
         <input type="text" ng-model="obj.name" /> 
        </td> 
        <td> 
         <input type="text" ng-model="obj.amount" /> 
        </td> 
        <td> 
         <input type="text" ng-model="obj.status" /> 
        </td> 
       </tr> 

當您從HTML更改任何數據,它在你的角度的控制器自動反映。即在$ scope.objs對象中。

相關問題