Angularjs相當於序列化

Question

我正在Angularjs應用程序中工作，並且我有一個簡單的表單。我需要創建一個簡單的方法來獲取所有表單數據，比如jQuery序列化。但我的數據綁定不是一個好的解決方案。我form'll有一些「場」是這樣的：

<div class="multiselect-container" > 
<label>Countries:</label> 
<ul> 
    <li ng-repeat="country in countries" > 
     <input type="checkbox" id="country_{{country.id}}" value="{{country.id}}" /> 
     <label for="country_{{country.id}}" >{{ country.name }}</label> 
    </li> 
</ul> 

每一個「場」我一個可以選擇一組元素。有人可以告訴我一個很好的解決方法（）的方法。

謝謝！

Answer 1

我認爲數據綁定是個不錯的解決辦法，反正你可以使用自定義的指令，它會序列數據，並設置爲值你指定的屬性：

function MC($scope) { 
    $scope.$watch('prop', function (v) { 
     console.log(v); 
    }); 
} 

angular.module('ng') 
.directive('formSerialization', function() { 
    return { 
     scope: { 
      'formSerialization': '=' 
     }, 
     link: function (scope, elem, attrs) { 
      console.log(attrs); 
      $(elem).closest('form').submit(function() { 
       var form = this; 
       scope.$apply(function() { 
        scope.formSerialization = $(form).serialize(); 
       }); 
      }); 
     } 
    }; 
}); 

你可以使用它以下標記：

<form ng-app="" ng-controller="MC"> 
    <input name="txt" type="text" ng-model="prop" /> 
    <input data-form-serialization="prop" type="submit" value="Submit" /> 
</form> 

這裏是一個JSFiddle DEMO。

Answer 2

謝謝你的答案。我不會以很好的方式揭露我的問題，但我找到了一個簡單的解決方案。

<div class="multiselect-container" > 
    <label>Countries:</label> 
    <ul> 
     <li ng-repeat="country in countries" > 
      <input type="checkbox" id="country_{{country.id}}" ng-model="data.countries[country.id]" value="{{country.id}}" /> 
      <label for="country_{{country.id}}" >{{ country.name }}</label> 
     </li> 
    </ul> 
</div> 

謝謝！

Answer 3

你可以試試這個，http://docs.angularjs.org/api/ng/function/angular.toJson

通過這種方式，你可以將對象序列化到JSON字符串