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

Trying to use ng-model in services file

本文关键字:ng-model 文件 服务      更新时间:2023-09-26

我正在尝试使用我的ng模型里程值。mpg,但当我实际使用我的函数值被记录为未定义。我不认为我做错了什么,因为我以前就能使用这个方法。我不明白为什么它不起作用。是不是我做错了什么,只是没发现。任何帮助都将非常感激。我试图在我的添加函数中实现这一点。

因此,经过不断的努力,除了mpg值的添加之外,我的一切都工作了,我正在计算它,但我无法访问它。这可能是因为我没有实际输入值作为输入吗?我只是需要一些解决办法。

tab-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);
})

在您的console.log中,里程是一个数组,因此它不知道属性。mpg。我认为你想要英里数。在mpg中,您还试图将id设置在数组上,而不是在mpg对象上。

在你的编辑和保存函数中,你也引用了一个未知的对象里程,它(可能)应该是mpg(与函数参数相同)