2014-10-21 2 views
0

У меня есть строки и COLS, как следует:лучше понять директивы сферы

 <ul class="ulgen clearfix" > 
     <li class="clearfix" ng-repeat='game in games| limitTo:limitrows'> 
      <div class="col1">{{game.id}}</div> 
      <div class="col2"> 
       <span winner1 id="g{{$parent.$index+game.id}}1" ng-click="check($parent.$index,game.id,1)" data-row="{{game.id}}" data-col="{{$parent.$index+1}}" data-type="1" data-checked="0" class="gamebtncommen"> 
       {{game.value| split:'-':0}} 
       </span> 
      </div> 
      <div class="col3"> 
       <span winner1 id="g{{$parent.$index+game.id}}0" ng-click="check($parent.$index,game.id,0)" data-row="{{game.id}}" data-col="{{$parent.$index+1}}" data-type="0" data-checked="0" class="gamebtncommen">X</span> 
      </div> 
      <div class="col4"> 
       <span winner1 id="g{{$parent.$index+game.id}}2" ng-click="check($parent.$index,game.id,2)" class="gamebtncommen" data-row="{{game.id}}" data-col="{{$parent.$index+1}}" data-type="2" data-checked="0"> 
       {{game.value| split:'-':1}} 
       </span> 
      </div> 
     </li> 

тогда я построил эту директиву:

tmControllers.directive('winner1', function() { 
return { 
    restrict: 'A', 
    link: function(scope, element, attrs) { 
    scope.check = function(col, row, type) { 
     col++; 
     console.log(element); 
     var el = element//$('.gamebtncommen[data-row="' + row + '"][data-col="' + col + '"][data-type="' + type + '"]'); 
     if (el.hasClass('orangeback')) { 
      el.removeClass('orangeback'); 
      element.attr('data-checked', 0); 
      scope.clacprice(); 
     } else { 
      el.addClass('orangeback').data('checked', 1); 
      element.attr('data-checked', 1); 
      scope.clacprice(); 
     } 
    } 

    scope.clacprice = function() { 

     var siz = $('.gamebtncommen[data-col="1"][data-checked="1"]').size(); 

     console.log(siz); 

проблема заключается в том, что строка получает одинаковый объем при проверке срока , Я хочу, чтобы директива изменила данные каждого диапазона, каждая строка проверила данные 1, в то время как я бы остановил ее на 3, если проверено 3 пролета

+0

Проверить этот блог: http://www.undefinednull.com/2014/02/11/mastering-the-scope-of-a-directive-in-angularjs/ –

ответ

2

Вы должны определить scope property директива. Если вы не в курсе директивы области видимости то для справки, мы можем определить сферу из более директивы трех способов, которые

  • изолированного сфера
  • унаследовал сфера,
  • такой же/родительский scope.

По умолчанию все директивы имеют же/родительский объем (третий вариант). Вы можете узнать больше о директивной области на блоге scope-in-angularjs.

+0

хороший пост, так что в моем случае scope: true, решит? – user3881381

0

Создание изолированной области действия в директиве Изоляция области действия в директиве - это простой процесс. Начните с добавления свойства scope в директиву, как показано ниже. Это автоматически изолирует область действия директивы от любых родительских областей.

tmControllers.directive('winner1', function() { 
    return { 
     scope: {}, 

    }; 
}); 
+0

работает правильно в контроллере, правильно ли это делать без указания? – user3881381

Смежные вопросы