AngularJS数据模型架构

时间:2015-08-25 16:25:13

标签: javascript json angularjs datamodel

我的Angular应用程序中有以下内容:

---
spring:
  profiles: peer1
eureka:
  instance:
    hostname: peer1
    metadataMap:
      # Each eureka instance need unique id. By default its hostname so we would have to use 1 server per service
      instanceId: PEER1_${spring.application.name}:${spring.application.instance_id:${random.value}}
---
spring:
  profiles: peer2
eureka:
  instance:
    hostname: peer2
    metadataMap:
  # Each eureka instance need unique id. By default its hostname so we would have to use 1 server per service
      instanceId: PEER2_${spring.application.name}:${spring.application.instance_id:${random.value}}

在HTML部分:

$scope.things = [{
   title: 'Simple',
   type: 1,
   form: {
         input: [1, 2, 3],                        
         clone: true
      }
}];

$scope.clone = function(item) {
   item.form.input.push(Math.floor(Math.random() * 999));
};

Clone 按钮时,我将一个新元素推送到form.input数组并向DOM添加一个新输入。

我想$ http.post输入的所有值。

我知道要推送我需要使用的东西

<div ng-repeat="item in things" class="item">
   <h2>{{item.title}}</h2>
   <div ng-repeat="input in item.form.input">
       <input type="text" />
   </div>
   <button ng-click="cloneInput(item)">Clone</button>
</div>

但我不知道如何从所有 .item 输入中创建一个对象。

有人可以向我解释如何或建议更好的解决方案吗?

1 个答案:

答案 0 :(得分:1)

如果您使用ng-model作为输入并将其设置为对象,则可以将该对象注入帖子,这是一个非常基本的示例:

JSFiddle

HTML:

<div ng-app="myApp" ng-controller="dummy">
    <div ng-repeat="input in items">
        <input type="text" name="{{input.name}}" ng-model="data[input.name]" />
    </div>
    <button ng-click="submit()">Submit</button>
    <p ng-show="displayIt">{{data}}</p>
</div>

JS:

angular.module('myApp', [])
    .controller('dummy', ['$scope', function ($scope) {
    $scope.items = [{
        name: 'test'
    }, {
        name: 'test2'
    }];

    $scope.data = {};
    $scope.displayIt = false;
    $scope.submit = function () {
        // This is only to check it
        $scope.displayIt = true;
        // Do your post here
    };

}]);
相关问题