2015-08-21 13 views
7

AngularJS, boşsa, AngularJS bir form alanını serileştirmez. Ancak, bu alanlar, boş olsalar bile, oluşturulan JSON içinde olmak için ihtiyacım var. JSON'u sorgulamaya çalışıyorum ve alan tanımlayıcıları yoksa, başarısız olur. Bunu yapmak için AngularJS almak için nasıl herhangi bir ipucu?Boş form alanlarını serileştirmek için AngularJS'yi nasıl zorlayabilirim

Aşağıdaki örnekte, ad alanına "John" girdiyseniz ve isteğe bağlı alanda hiçbir şey girilmezse, oluşturulan json budur {name: John}. Ama bunun gibi olmasını istiyorum. {Name: 'John', optionalval: ''}. Bu, isteğe bağlı alanların herhangi bir değere sahip olmayabileceği bir "yeni" formun olması durumundadır. Ancak, alanların değerlere sahip olup olmadıklarına dair gönderilmesi gerekir.

<!doctype html> 
 
<html> 
 
    <head> 
 
     <title>Serialize Test</title> 
 
     <script src="js/angular.min.js"></script> 
 
     <script> 
 
\t \t \t var app = angular.module('myApp', []); 
 
\t \t \t app.controller('myCtrl', function($scope, $http) { 
 
\t \t \t \t $scope.addnew = function(){ 
 
\t \t \t \t \t $http.put('/newthing.json', JSON.stringify($scope.item)) 
 
\t \t \t \t \t \t .success(function(){ 
 
\t \t \t \t \t \t }) 
 
\t \t \t \t \t \t .error(function(){ 
 
\t \t \t \t \t \t }); 
 
\t \t \t \t }; 
 
\t \t \t }); 
 
     </script> 
 
    </head> 
 
    <body ng-app="myApp" ng-controller="myCtrl"> 
 
\t \t <label for="name">Name:</label> 
 
\t \t <input type="text" id="name" ng-model="item.name" required> 
 
\t \t <label for="optionalval">Don't put anything here:</label> 
 
\t \t <input type="text" id="optoinalval" ng-model="item.optionalval"> 
 

 
\t \t <button ng-click="addnew()">Serialize</button> 
 
    </body> 
 
</html>

+1

: Burada

$scope.item = {optionalval: ''}; 

bir demodur . Bazı kodları sağlayın. – charlietfl

+0

göremediğimiz sorunları şu şekilde deneyemeyiz: var dataJSON = {field1: '1', field2: ''}, $ http {data: JSON.stringify (dataJSON) –

+0

Girişinize bir model ekleyin ve iyi olmalısın. Kodu göster lütfen. – ajmajmajma

cevap

6

bir yolu boş dize ile modelini preinitialize etmektir. Örneğin, denetleyici model değerini ayarlayarak: düzgün `ng-model` kullanıyorsanız bir sorun olmamalı

var app = angular.module('myApp', []); 
 
app.controller('myCtrl', function($scope, $http) { 
 
    $scope.item = {optionalval: ''}; 
 
    $scope.addnew = function() { 
 
    $http.put('/newthing.json', JSON.stringify($scope.item)) 
 
    .success(function() {}) 
 
    .error(function() {}); 
 
    }; 
 
});
<script src="https://code.angularjs.org/1.4.3/angular.js"></script> 
 

 
<div ng-app="myApp" ng-controller="myCtrl"> 
 
    <label for="name">Name:</label> 
 
    <input type="text" id="name" ng-model="item.name" required> 
 
    
 
    <label for="optionalval">Don't put anything here:</label> 
 
    <input type="text" id="optionalval" ng-model="item.optionalval"> 
 

 
    <button ng-click="addnew()">Serialize</button> 
 
    <pre>{{item | json}} 
 
</div>

+0

'ng-init' kullanmak yerine kontrol cihazlarından başlatmayı kullanmalısınız. Bu doğru kullanım değildir, daha fazla bilgi için belgelere bakın. https://docs.angularjs.org/api/ng/directive/ngInit – cverb

+2

@cverb Eh, bu direktif ** direktif ** kullanımıdır, ancak denetleyici kullanımı bu durumda daha iyi olabilir. Düzenlenen. – dfsq

+0

dfsq ve @cverb, yanıtlarınız için teşekkür ederiz. Cevap olarak dfsq'in cevabını işaretledim ama farklı bir tane olmasını umuyordum. Gerçek dünyadaki kodum yaklaşık 50'den fazla alana sahip bir ürünle ilgileniyor ve tüm bu alanları baştan çıkarmayı umduğumu umuyordum ve sadece istediği herhangi bir formun serileştirilmesini gerçekleştirebilecek genel bir "öğe" denetleyiciye sahip olmak istiyordum. Bir denetleyici olarak kullanın. Her öğe türü için bir şeyler yazmam gerekecek gibi görünüyor. Tekrar teşekkürler! – rogdawg

İlgili konular