angular nested指令回调

时间:2016-05-11 15:06:18

标签: javascript angularjs angularjs-directive callback

我有一个list指令(实际上是一个表,但这没关系),其中每个元素都有一个工具指令(选择,编辑,删除按钮)。 tools指令获取每个操作的回调,因此特定控制器可以单独实现每个操作。现在我不清楚如何将所选项目传递给控制器​​回调。 有什么想法?

工具指令:

使用Javascript: 在这里我定义了回调

app.directive('itemTools', function() {
return {
  restrict: 'AE',
  transclude: true,
  scope: {
    item: '=',
    selectCallback: '&',
    editCallback: '&',
    deleteCallback: '&',
    cloneCallback: '&',
    activateCallback: '&',
    deactivateCallback: '&',
  },

  link: function(scope, element, attr) {

  },
  templateUrl:'templates/common/item.tools.html',
  controller: function($rootScope, $scope) {
  }
}

});

HTML:

<div>
 <button ng-click="selectCallback({id: item.id})">
 </button>
 <button ng-click="editCallback({id: item.id})">
 </button>
 <button ng-click="deleteCallback({id: item.id})">
 </button>
 <button ng-click="cloneCallback({item: item})">
 </button>
 <button ng-click="activateCallback({item: item})">
 </button>
 <button ng-click="deactivateCallback({item: item})">
 </button>
</div>

list指令: 这些回调将进一步处理 item-tools

app.directive('moduleList', function() {
return {
  restrict: 'E',
  scope: {
    modules: '=',
    selectCallback: '&',
    editCallback: '&',
    deleteCallback: '&',
    cloneCallback: '&',
    activateCallback: '&',
    deactivateCallback: '&',
  },
  templateUrl:'templates/module/module.list.html',
  controller: function($scope) {

  }
}

});

HTML:

<table class="table table-responsive">
  <tbody>
    <tr ng-repeat="item in items | orderBy:orderByField:reverseSort>
      <td class="text-center">
        SOME DATA OF THE OBJECT....
      </td>
      <td>
        <item-tools
        item="item"
        select-callback="selectCallback({id: item.id})"
        edit-callback="editCallback(item.id)"
        delete-callback="deleteCallback(item.id)"
        clone-callback="cloneCallback(item)"
        activate-callback="activateCallback(item)"
        deactivate-callback="deactivateCallback(item)">
        </item-tools>
      </td>
    </tr>
  </tbody>
</table>

到目前为止我已经知道了控制器函数被调用,但我不知道如何传递所选项本身。

提前致谢。

1 个答案:

答案 0 :(得分:0)

通过将父指令控制器分配给子节点,

子指令链接到父节点:

var fso = new ActiveXObject("Scripting.FileSystemObject");


var chrome = "C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe";
var url = 'http://google.com';

if (fso.FileExists(chrome)){
    var objShell = WScript.CreateObject("Shell.Application");
    objShell.ShellExecute(chrome, "--app="+url, "", "", 1);
}
else{ //if chrome doesn''t exists, so launch ie :
    oIE1 = WScript.CreateObject ("InternetExplorer.Application");

    oIE1.Visible = 1;
    oIE1.AddressBar = 0;
    oIE1.StatusBar = 0;
    oIE1.ToolBar = 0;
    oIE1.MenuBar = 0;
    oIE1.Navigate(url);
}