當使用ng-model angularjs時不顯示錶格值

我得到了一個用於編輯產品的表單，該值顯示在檢查器中，但不在表單中。當我從代碼中刪除ng模型時，它們會顯示。當使用ng-model angularjs時不顯示錶格值

在該行中的值示出了在檢查元件，但不是在形式：

<input type="text" class="form-control" placeholder="Product naam" 
value="{{product.title}}" ng-model="formData.title"/>

在該行中的值示出了在檢查元件，並且在形式：

<input type="text" class="form-control" placeholder="Product naam" 
value="{{product.title}}"/>

但是我需要ng-model來傳遞數據。

有什麼建議嗎？

來源

2015-12-15 Nick Audenaerde

您不需要輸入標記中的value屬性。 ng模型已經爲你做了綁定。如果您在控制器中定義了formData.title，它將反映您輸入的值。

同樣，如果用戶更改輸入值，它將反映在控制器中聲明的值。

這是着名的AngularJS的雙向數據綁定。一個真棒，框架的危險功能

看看這個小提琴：

http://jsfiddle.net/relferreira/kLcqwuqf/

HTML：

<div ng-app="app"> 

    <div ng-controller="MainController"> 
    <input type="text" data-ng-model="test"> 
    </div> 

</div>

JS：

angular.module('app', []); 

angular.module('app') 
    .controller('MainController', mainController) 

mainController.$inject = ['$scope']; 
function mainController($scope){ 

    $scope.test = 'value of the input' 

}

來源

2015-12-15 13:08:55

感謝現在的工作 –

@NickAudenaerde：如果你發現你的解決方案，您可以關閉這個問題。 – dreamweiver

@NickAudenaerde如果它很有用，請將其標記爲答案。這不是要點，而是要向其他人展示這是問題的解決方案。 –

如果data-ng-model="form.test"然後你將如何在輸入框中填充它的值。只需修改Renan的答案，以便它可以幫助您更輕鬆地理解解決方案。

angular.module('app', []); 
 

 
    angular.module('app') 
 
     .controller('MainController', mainController) 
 

 
    mainController.$inject = ['$scope']; 
 

 
    function mainController($scope) { 
 
     $scope.form = {}; 
 
     $scope.form.test = 'value of the input' 
 

 
    }

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="app"> 
 

 
    <div ng-controller="MainController"> 
 
    <input type="text" data-ng-model="form.test"> 
 
    </div> 
 

 
</div>

來源

2016-07-23 09:22:20

當使用ng-model angularjs時不顯示錶格值

回答

相關問題