Question

我正在处理一个ng-model的问题。

首先，我将展示ng-model正常工作的部分

  <input type="text"
         ng-model="slip.risk"
         ng-change="riskWinCalculations(slip, 'RISKSTRAIGHT')">

  <input type="text"
         ng-model="slip.win"
         ng-change="riskWinCalculations(slip, 'WINSTRAIGHT')">

  <strong>To Win: </strong>{{straightTotalWin | currency}}

  <strong>Total Stake: </strong>{{straightTotalStake | currency}}

现在ng-model对我不起作用的html

  <input type="text"
         ng-change="riskWinCalculations(null, 'RISKPARLAY')"
         ng-model="riskParlay">

  <strong>To Win: </strong>{{winParlay | currency}}

  <strong>Total Stake: </strong>{{riskParlay | currency}}

在这个控制器中，你会看到一个名为applyParlayRisk的函数给我提出问题以及其他名为riskWinCalculations的函数，其中案例RISKPARLAY也给我带来了问题，其余的，像魅力一样工作

   applyStraightRisk = function(slip) {
      var moneyLine = _.result(_.find(slip.lines, {isSelected: '1'}), 'moneyLine');
      slip.win = RiskWikCalculations.calculateStraightBet(slip.risk, parseFloat(moneyLine, 10), true);
    }, 

   applyStraightWin = function(slip) {
      var moneyLine = _.result(_.find(slip.lines, {isSelected: '1'}), 'moneyLine');
      slip.risk = RiskWikCalculations.calculateStraightBet(slip.win, parseFloat(moneyLine, 10), false);
    }, 

   applyParlayRisk = function(parlay, riskParlay) {
      $scope.riskParlay = riskParlay;
      console.log($scope.riskParlay);
      //this logs UNDEFINED
      $scope.winParlay = riskParlay * (parlay.payoutProportion || 4.5);
    }, 

  sumStraightStakes = function(betSlip) {
      var totalStake = 0,
          totalWin = 0;
      _.each(betSlip, function(slip) {
        if (slip.risk) {
          totalStake += parseFloat(slip.risk, 10);
        }
        if (slip.win) {
          totalWin += parseFloat(slip.win, 10);
        }
      });
      $scope.straightTotalStake = totalStake;
      $scope.straightTotalWin = totalWin;
    };


    $scope.riskAll = 0;
    $scope.winAll = 0;
    $scope.riskWinCalculations = function(slip, type) {
    switch (type) {
      case 'RISKSTRAIGHT':
        applyStraightRisk(slip, slip.risk);
        break;
      case 'WINSTRAIGHT':
        applyStraightWin(slip, slip.win);
        break;
      case 'RISKPARLAY':
        applyParlayRisk($scope.currentParlay, $scope.riskParlay);
        break;
     }
     sumStraightStakes($scope.betSlip);
    };

所以你认为我在哪里犯了错误？

更新

在移动应用中，我正在执行完全相同的功能，并且工作正常，请看

HTML

  <button ng-click="openRiskWinKeypad(null, 'RISKPARLAY')">
     Risk: {{riskParlay}}
  </button>

  <strong>Total Stake: </strong>{{riskParlay | currency}}

  <strong>To Win: </strong>{{winParlay | currency}}

控制器

applyParlayRisk = function(parlay, amount) {
      $scope.riskParlay = amount;
      $scope.winParlay = amount * (parlay.payoutProportion || 4.5);}

这有点不同，因为我正在打开自定义键盘

$scope.openRiskWinKeypad = function(slip, type) {
      $scope.keypad = {value: 0};
      if (type === 'RISKSTRAIGHT' && slip.risk) {
        $scope.keypad.value = slip.risk;
      }
      if (type === 'WINSTRAIGHT' && slip.win) {
        $scope.keypad.value = slip.win;
      }

      $ionicPopup.show({
         // here is where the keypad opens
      }).then(function(amount) {
        if (amount) {
          switch (type) {
            case 'RISKSTRAIGHT':
              applyStraightRisk(slip, amount);
              break;
            case 'WINSTRAIGHT':
              applyStraightWin(slip, amount);
              break;
              break;
            case 'RISKPARLAY':
              applyParlayRisk($scope.currentParlay, amount);
              break;
          }
        }
        sumStraightStakes($scope.betSlip);
      });
    };

修改

如果我这样做

<input type="text" ng-model="riskParlay"
       ng-change="riskWinCalculations(null, 'RISKPARLAY')">

和

applyParlayRisk = function(parlay, riskParlay) {
      $scope.riskParlay = riskParlay;
      console.log($scope.riskParlay);
      $scope.winParlay = riskParlay * (parlay.payoutProportion || 4.5);
    }

和

    case 'RISKPARLAY':
      applyParlayRisk($scope.currentParlay, riskParlay);
      console.log($scope.currentParlay.name);
      break;

我得到的只是

ReferenceError：未定义riskParlay

Answer 1

我无法确定，因为你没有发布整个html片段，但我的猜测是在riskParlay输入和控制器之间还有另一个范围。如果有，ng-model指令会将riskParlay变量写入该范围，而不是控制器的范围。

您的其他输入恰好起作用，因为它们的表达式（。运算符）中有对象索引。具有该运算符的Ng模型表达式查找范围层次结构，直到找到具有索引对象的范围。此视频更好地解释了它：https://thinkster.io/egghead/the-dot

关于逻辑的ng-model问题

1 个答案: