尝试在服务文件中使用ng-model

时间:2015-08-06 19:06:33

标签: javascript angularjs ionic-framework

我正在尝试使用我的ng-model mileages.mpg的值,但是当我实际使用我的函数时,值被记录为undefined。因为我之前能够使用这种方法,所以我认为我做错了什么。我不明白为什么它不起作用。有什么我做错了,只是没有看到。任何帮助将不胜感激。我试图在我的添加功能中实现它。

因此,经过不断的努力,除了添加mpg值之外我还能正常工作,我正在计算它,但我无法访问它。这可能是因为我没有在物理上输入值作为输入吗?只需要某种想法来修复。

制表calculations.html

    <ion-view view-title="Calculations">
  <ion-content class="padding">
  <form oninput="x.value=parseInt(a.value)/parseInt(b.value)" ng-model="mileage.mpg">
    <input type="number" id="a" placeholder="Enter Miles Driven" ng-model="mileage.miles_driven">
    /<input type="number" id="b" placeholder="Enter gallons added" ng-model="mileage.gallons_added">
    =<input type="number" name="x" for="a b" placeholder="Mileage">
  </form>
  <input class="input" ng-model="mileage.car" placeholder="Enter Car model and year"> 
  <ion-button class="button" ng-click="add(mileage)">Add</ion-button>
  </ion-content>
</ion-view>

services.js

    angular.module('gas-mileage-tracker.services', [])

.factory('Mileages', function() {
    var mileages = [{
    id: 0,
    mpg: "17",
    car: "1998 Toyota 4runner",
    miles_driven: "",
    gallons_added: ""
  }, {
    id: 1,
    mpg: 16,
    car: "2002 Toyota 4runner",
    miles_driven: "",
    gallons_added: ""
  }, {
    id: 2,
    mpg: 18,
    car: "2002 Toyota 4runner",
    miles_driven: "",
    gallons_added: ""
  }, {
    id: 3,
    mpg: 17,
    car: "1998 Toyota 4runner",
    miles_driven: "",
    gallons_added: ""
  }, {
    id: 4,
    mpg: 18,
    car: "2002 Toyota 4runner",
    miles_driven: "",
    gallons_added: ""
  }];

  return {
    all: function() {
      return mileages;
    },
    remove: function(mileage) {
      mileages.splice(mileages.indexOf(mileage), 1);
    },
    add: function(mileage) {
      mileages.id = mileages.length;
      mileages.push({
        editMode: false,
        id: mileages.id,
        mpg: mileage.mpg,
        car: mileage.car
      });
      console.log(mileage.m);
      mileage.mpg= '';
      mileage.miles_driven= '';
      mileage.gallons_added= '';
      mileage.car= '';
    },
    edit: function(mpg) {
      mileage.editMode = true;
      mileages.mpg = mileage.mpg
      console.log(mileage);
    },
    save: function(mpg) {

        mileage.editMode = false;
    },
    get: function(mileageId) {
      for (var i = 0; i < mileages.length; i++) {
        if (mileages[i].id === parseInt(mileageId)) {
          return mileages[i];
        }
      }
      return null;
    }
  };
});

controllers.js

angular.module('gas-mileage-tracker.controllers', [])

.controller('CalculationsCtrl', function($scope, Mileages) {
    $scope.add = function(mileage) {
        Mileages.add(mileage);
    }
})
.controller('MileagesCtrl', function($scope, Mileages) {
    $scope.mileages = Mileages.all();
    $scope.remove = function(mileage) {
        Mileages.remove(mileage);
    };
    $scope.add = function(mileage) {
        Mileages.add(mileage);
    };

})
.controller('MileageDetailsCtrl', function($scope, $stateParams, Mileages) {
    $scope.mileage = Mileages.get($stateParams.mileageId);
})

1 个答案:

答案 0 :(得分:1)

arg中,里程数是一个数组,所以它不知道属性.mpg。我想你想要mpg.mpg,你也试图在数组上设置console.log而不是mpg对象。

在你的编辑和保存功能中,你也指的是一个未知物体里程,它(可能)应该是mpg(与功能参数相同)