Question

我正在尝试动态分配ng-model名称，以便通过键入'$ scope.numbers.no1'，'$ scope.numbers.no2'等来在控制器中访问ng-model名称等等上。到目前为止，我正在尝试此代码而没有结果：

<div ng-repeat="row in numbersArray" class="numbersRow">
    <div ng-repeat="num in row" class="number" ng-model="numbers['no' + num]">{{num}}</div>         
</div>

在我的控制器中：

$scope.numbers = {};
$scope.numbersArray = [[1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
                       [11, 12, 13, 14, 15, 16, 17, 18, 19, 20],
                       [21, 22, 23, 24, 25, 26, 27, 28, 29, 30],
                       [31, 32, 33, 34, 35, 36, 37, 38, 39, 40],
                       [41, 42, 43, 44, 45, 46, 47, 48, 49, 50],
                       [51, 52, 53, 54, 55, 56, 57, 58, 59, 60],
                       [61, 62, 63, 64, 65, 66, 67, 68, 69, 70],
                       [71, 72, 73, 74, 75, 76, 77, 78, 79, 80]];

并测试我正在执行：

$scope.numbers.no1 = 'A';

但没有任何反应。我在这里做错了什么？

更新：我想到的是我错误地尝试在div上使用ng模型。我想要实现的是从80个数字中选择一个随机数，并使其背景为黑色以表明它已被选中。

Answer 1

https://plnkr.co/edit/vT6sU9XnYJsov4q7euwK?p=preview

<div ng-repeat="row in numbersArray" class="numbersRow">
    <div ng-repeat="num in row" ng-class="{'clickedNumber': numbers[num]}"
         ng-click="numbers[num] = !numbers[num]" class="number">{{num}}</div>         
</div>

Answer 2

上面的代码循环遍历$scope.numbersArray，并将其放入$scope.numbers（键是输入值）。希望这是你在寻找的东西：

<div ng-repeat="row in numbersArray">
  <div ng-repeat="num in row">
    <input ng-model="numbers['no' + num]" /> {{num}}
  </div>
</div>

Demo on JsFiddle

带前缀的动态类名

2 个答案: