使用与NG-重复

Question

我试着写一些东西，让我编辑记录带有日期的，我有我的这个表里面的角日期选择器：

 <tr ng-repeat="event in eventFixtures track by $index"> 
      <td>{{event.date | date: 'dd/MM/yyyy'}}</td> 
      <td> 
       <div class="row"> 
        <div class="col-md-6"> 
         <p class="input-group"> 
          <input type="text" 
            class="form-control" 
            ng-model="event.date" 
            is-open="fixture{{$index}}popup" 
            ng-click="openFixturePopup($index)"/> 
         </p> 
        </div> 
       </div> 
      </td> 
     </tr> 

但是当我去点击一个日期选择器没有出现在输入框中。

open函数是在这里：

$scope.openFixturePopup = function(fixture) { 
    $scope["fixture"+fixture+"popup"] = true; 
}; 

的变量delcared像这样：

for(var i = 0; i < data.length; i++) { 
     $scope["fixture"+i+"popup"] = false; 
    } 

从具有变量的值的表格上方被打印出来，它们被改变，并且如果我创建一个链接到特定的灯具弹出的输入例如像这样：

<div class="row"> 
    <div class="col-md-6"> 
     <p class="input-group"> 
      <input type="text" 
        class="form-control" 
        uib-datepicker-popup="{{format}}" 
        ng-model="testDate" 
        is-open="fixture0popup" 
        ng-click="openFixturePopup(0)"/> 
     </p> 
    </div> 
</div> 

它工作正常。

有谁知道可能会导致什么呢？

Answer 1

我有一个预感，试图使用插值的变量名是什么扔这个。我尝试了很多东西，如$scope[dynamicVarName]，$scope.$eval([dynamicVarName])等无济于事。我不能确定这是你的问题，但我想我找到了一个可以尝试的解决方案。

在您的事件上设置一个isOpen标志并查看该标志，而不是为状态创建一堆范围变量。这也是有利的，因为如果索引更改，打开状态随数组元素一起移动，所以您获得无效状态的机会较少。

下面的代码可能是什么样子：

var app = angular.module("myApp", []) 
 
.controller("myCtrl", function ($scope) { 
 
    $scope.eventFixtures = [ 
 
    {name: "1", date: "1-1-01"}, 
 
    {name: "2", date: "2-2-02"}, 
 
    {name: "3", date: "3-3-03"}, 
 
    {name: "4", date: "4-4-04"}, 
 
    {name: "5", date: "5-5-05"} 
 
    ]; 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="myCtrl"> 
 
    <table> 
 
    <tr ng-repeat="event in eventFixtures track by $index"> 
 
     <td>{{event.date | date: 'dd/MM/yyyy'}}</td> 
 
     <td> 
 
     <div class="row"> 
 
      <div class="col-md-6"> 
 
      <p class="input-group"> 
 
       <input type="text" 
 
        class="form-control" 
 
        ng-model="event.date" 
 
        is-open="{{event.isOpen}}" 
 
        ng-blur="event.isOpen = false;" 
 
        ng-focus="event.isOpen = true;"/> 
 
       isOpen? {{event.isOpen || false}} 
 
      </p> 
 
      </div> 
 
     </div> 
 
     </td> 
 
    </tr> 
 
    </table> 
 
</div>