呼叫控制器$范围方法

我有以下指令：

指令1个

app.directive('tableDiv', function() { 
    return { 
     templateUrl: 'js/directives/table-div/table-div.html', 
     replace: true, 
     scope: { 
      table: '=', 
     }, 
     controller: function ($scope, $element, $attrs) { 

     }, 
     link: function postLink(scope, element, attrs) { 

     } 
    } 
});

指令1个模板：

<div data-table-div-row value="row" sizes="table.tbody.sizes" ng-repeat="row in table.tbody.values"> 
</div>

指令2：

app.directive('tableDivRow', function ($rootScope) { 
    return { 
     templateUrl: 'js/directives/table-div/table-div-row.html', 
     replace: true, 
     scope: {value: '=', sizes: '='}, 
     controller: function ($scope, $element, $attrs) { 
      $scope.showInfo = function() { 
       $scope.visible = true; 
      }; 

      $scope.hideInfo = function() { 
       $scope.visible = false; 
      }; 

      $scope.hasTemplate = function() { 
       return ($scope.value.template ? true : false); 
      } 

     }, 
     link: function postLink(scope, element, attrs) { 
      scope.$watch(function() { 
       return scope.visible; 
      }, function (value) { 
       if (value === true) { 
        $(element).find('div.table-row').addClass('open'); 
        $(element).find('div.table-row.edit').removeClass('hidden'); 
       } else { 
        $(element).find('div.table-row').removeClass('open'); 
        $(element).find('div.table-row.edit').addClass('hidden'); 

       } 
      }, true); 
     } 
    } 
});

指令2模板TE：

<div> 
<div class="row-fluid"> 
    <div class="table-row clearfix"> 
     <div class="{{sizes.first}} first">{{value.display.first}}</div> 
     <div ng-repeat="cell in value.display.cells" class="{{sizes.cells[$index]}}">{{cell}}</div> 
     <div class="{{sizes.last}} last regular"> 
      <div ng-switch on="value.display.last"> 
       <div ng-switch-when="%editbutton%"> 
        <div class="show-info closed" ng-click="showInfo()"></div> 
       </div> 
       <div ng-switch-default> 
        {{value.display.last}} 
       </div> 
      </div> 
     </div> 
    </div> 
</div> 
<div ng-if="hasTemplate()"> 
    <ng-include src="value.template"></ng-include> 
</div>

里面我包括基于控制器$范围模型动态模板的第二个指令模板。在该模板和指令模板中，我想从控制器$ scope调用一个函数。有没有办法实现这一点？

来源

2013-05-21 lucassp

所以，它似乎是在文档中，它不够清楚。里面的指令，声明我需要添加：

<div data-table-div-row method="method()" value="row" sizes="table.tbody.sizes" ng-repeat="row in table.tbody.values"></div>

这样的方法：method: '&'

scope: { 
     table: '=', 
     method: '&' 
    },

，并在那里我所说的指令模板内，该method HTML属性必须在年底之前()可以传递给第二个指令。

来源

2013-05-21 13:18:02 lucassp

现在我有一个问题。在第二个指令的控制器内部，我用一些随机值作为参数调用该函数：'$ scope.expandCallback && $ scope.expandCallback（“text”）;'但参数不会传递给控制器范围方法。 'console.log（arguments）'输出一个空数组。 – lucassp

尝试传递'{message：“文本”}“ – Direvius

为<ng-include src="value.template"></ng-include>创建子作用域，这意味着父级功能应该在此模板中可用。换句话说，你不应该做任何事情，它会工作 - 看到这个简单的例子：http://plnkr.co/edit/Es2UL09ASPSTa5Fstzjf?p=preview

来源

2013-05-21 12:46:02

是的，这是事实。我的主要问题是将一个函数的引用从控制器$ scope下传递给嵌套在第一个指令中的第二个指令。 – lucassp

由于@Direvius建议，呼吁在从指令控制器范围的方法，你必须调用传递对象与参数，而参数本身的方法：

scope.method({message : "text"});

所以，调用控制器的方法从嵌套的指令，你必须来包装n个对象里面的参数：

scope.method({message : {message : "text"}});

不要忘了申报“消息”作为嵌套的指令模板，并在你的HTML外指令声明的说法：

<outer-directive outer-method-arg="method(message)"></outer-directive>

也是你的外模板：

<inner-directive inner-method-arg="method(message)"></inner-directive>

来源

2016-01-29 09:23:02 andreu

呼叫控制器$范围方法

回答

相关问题