ng-model 逻辑问题

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 sn-p，但我猜 riskParlay 输入和控制器之间存在另一个范围。如果有，ng-model 指令会将 riskParlay 变量写入该范围，而不是控制器的范围。

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