我无法在角度的ng重复内访问$ scope.variable [index]

时间:2016-07-19 18:38:00

标签: angularjs indexing scope

我有一台路由器:

.config(['$routeProvider',function($routeProvider) {
    $routeProvider
      .when('/allbooks', {
        templateUrl: 'find/showAllMy.html',
        controller: 'controlador'
      }).when('/mybooks', {
        templateUrl: 'find/showAllMy.html',
        controller: 'controlador'
      })
      .when('/',{
        templateUrl: 'find/inputbook.html',
        controller:'controlador'
      })          
}]);

视图文件" showAllMy.html":

<div id='containerMyBooks' ng-init='MyRequests=0; RequestsForMe=0; '>

  <center><h3>{{titleMyAll}}</h3></center>

  <div id='containerbuttonsrequest'>
      <button class='waves-effect waves-light btn'>Your Trade Request {{MyRequests}}      </button>
      <button class='waves-effect waves-light btn'>Trade Request for you {{RequestsForMe}}</button>
  </div>

  <ul ng-repeat='b in Books' ng-init='tradeLink[$index]=true'>

      <li class='styleLi'>
          <a class='stylelinktrade' ng-show='tradeLink[$index]' href='/#/{{titleMyAll}}' ng-click="trade('yes',$index)"><img class="styleimgtrade" src='../images/trade.png'>trade!</a>
          <a class='stylelinktrade' ng-hide='tradeLink[$index]' href='/#/{{titleMyAll}}' ng-click="trade('no',$index)"><img class="styleimgtrade" src='../images/trade.png'>Cancel trade</a> 
          <img class='styleimgbook' src={{b.img}}>
      </li>

  </ul>

</div>

我控制器中的这个逻辑:

$scope.trade = function(yesNo, index) {      
  if (yesNo === 'yes') {
    $scope.MyRequests = $scope.MyRequests + 1;
  } else {
    $scope.MyRequests = $scope.MyRequests - 1;
  }
  console.log('log' + $scope.tradeLink[index]);
  // $scope.tradeLink[0]=!$scope.tradeLink[0];
}

但我似乎无法从视图中访问$ scope.tradeLink [index],而是收到一条错误,说“#34;无法读取未定义的属性1”。&#34; < / p>

我该如何解决这个问题?

1 个答案:

答案 0 :(得分:0)

那是因为你从未将tradeLink初始化为数组。在您的热门tradeLink = []中添加ng-init可以修复您的错误。

表示,请refrain from using ng-init

  

可以滥用此指令将不必要的逻辑量添加到模板中。 ngInit只有少数适​​当用途,例如对ngRepeat的特殊属性进行别名,如下面的演示所示;并通过服务器端脚本注入数据。除了这几种情况,您应该使用controllers而不是ngInit来初始化范围上的值。

相反,请删除所有ng-init用法(除了ng-repeat可能相关的用法之外)并将其添加到您的控制器中:

$scope.MyRequests = 0;
$scope.RequestsForMe = 0;
$scope.tradeLink = [];