呼叫控制器$範圍方法

我有以下指令：

指令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

呼叫控制器$範圍方法

回答

相關問題