Question

我有一个指令，需要一个驻留在它的父控制器上的变量

<hack-chart-controls counttime="vm.countInMinutes"></hack-chart-controls>

指令：

function hackChartControls($log, $parse) {
    var directive = {
        restriction: 'AE',
        scope: {
            counttime: '='
        },
        templateUrl: '/app/components/hackChartControls.html',
        link: link
    };

    return directive;

基于this answer，我能够观察该变量何时在指令中发生变化。

但是，在指令标记中因为我使用的是ControllerAs语法，所以我使用vm作为我的范围变量。例如：

<div class="close"><i class="fa fa-close" ng-click="vm.close()"></i></div>

在进行scope: { counttime: '=' }更改之前，这些ng-click函数工作得很好，因为它从父级继承了范围而没有隔离范围。

如何让click功能重新开始工作？

Answer 1

我会引用隔离范围内的动作，或者根本不使用隔离范围。这取决于您首先要使用隔离范围的原因。隔离范围的目的是封装指令并使其独立于外部范围。

function hackChartControls($log, $parse) {
    var directive = {
        restriction: 'AE',
        scope: {
            counttime: '=',
            action: '&',
        },
        templateUrl: '/app/components/hackChartControls.html',
        link: link
    };

    return directive;
}

你的模板：

<div class="close"><i class="fa fa-close" ng-click="action()"></i></div>

像这样使用：

<hack-chart-controls counttime="vm.countInMinutes" action="vm.close()"></hack-chart-controls>

混合隔离范围和控制器作为语法

1 个答案: