无法发布模型数据

时间:2015-12-09 20:39:26

标签: javascript angularjs ionic-framework angularjs-ng-model

我有一个角度应用程序,由三个标签形式组成。每个选项卡都使用自己的控制器和指定的服务。

当在表单上按下提交按钮时,在名为$scope.post的MainCtrl中找到的功能假定发布从每个表单字段ng-model检索的所有表单字段数据。

在服务器端,我收到在主控制器中形成的发布对象。此POST包含除工作之外的每个对象属性的所有值。我收到一个空对象作为工作属性的值。

为什么我无法检索模板代码中找到的work.comments ng-model?即使在控制台登录时,我也无法检索此项目。

这是我第一次使用Angular应用程序,我真的想学习如何正确地做事。如果您碰巧注意到一些本来就很愚蠢的东西,请告诉我。

控制器:

.controller('WorkCtrl', function ($scope, $ionicModal, TaskService, WorkService) {
    $scope.work = {};
    WorkService.add($scope.work);
});

服务:

.factory('WorkService', function() {
    var work = {};
    return {
        add: function(data) {
            work['work'] = data;
            //work = data;
        },

        list: function() {
            return work;
        }
    };
})

模板:

    <div class="list" ng-controller="WorkCtrl">
        <label class="item item-input item-floating-label">
          <button class="button button-clear item-icon-right" ng-click="newTask()">New Task<i class="icon ion-ios-plus-outline"></i></button>
        </label>
        <label class="item item-input item-floating-label">
          <span class="input-label">Comments</span>
          <textarea placeholder="Comments" rows="6" ng-model="work.comments"></textarea>
        </label>{{work | json}}
      </div>
 <div ng-controller="TaskCtrl"> 
    <div ng-show="ifTasks()">
      <div class="row header">
          <div class="col tableRow">Task</div>
          <div class="col tableRow">Edit</div>
          <div class="col tableRow">Remove</div>
      </div>
      <div class="row" ng-repeat="task in tasks track by task.id">
        <div class="col tableRow">{{task.choice}}</div>
        <div class="col tableRow" ng-controller="WorkCtrl"><button class="button button-small button-balanced" ng-click="editTask({{task.id}})">Edit</button></div>
        <div class="col tableRow"><button class="button button-small button-assertive" ng-click="del({{task.id}})">Delete</button></div>
      </div>
    </div>
  </div>

主控制器:

.controller('MainCtrl', function($scope, $http, SiteService, TaskService, WorkService, LabourService) {
    $scope.toFetch = [];

    var obj = {
        site: SiteService.list(),
        tasks: TaskService.list(),
        work: WorkService.list(),
        labour: LabourService.list()
    };

    $scope.post = function() {
        console.log(obj);
        $http({
            url: 'http://localhost:1818/send/report',
            method: 'POST',
            data: obj,
            headers: {'Content-Type': 'application/json'}
        })
        .then(function(data) {
            console.log(data);
        });
    };
});

0 个答案:

没有答案