属性双向绑定时AngularJS未定义对象

Question

我在AngularJS中尝试执行的操作遇到了问题。 事情是这样的：

我有一个控制器，并且有一个这样定义的指令：

helpers.directive('someEvent', function() {

    ...
    scope: {
       api: '='
    }
    ...
    controller: ['$scope', function($scope) {

        $scope.hasSomeEventOccured = function(){

            return booleanVariable
        };

        $scope.api = {
           hasSomeEventOccured: $scope.hasSomeEventOccured
       }
    }]

});

然后，在其他控制器中，我要访问该函数hasSomeEventOccured ...该控制器的定义如下：

moduleName.controller('moduleSomethingController',
['$scope', '$state', 'moduleRepository', function ($scope, $state, moduleRepository) {

    $scope.theEventOccured = $scope.someEventApi.hasSomeEventOccured();

}]);

在cshtml文件中，我有：

<some-event api="someEventApi" ></some-event>

<div ng-if="theEventOccured"></div>

偶尔发生的错误是$scope.someEventApi未定义。 因此，此行中断了： $scope.theEventOccured = $scope.someEventApi.hasSomeEventOccured(); 我认为发生这种情况是因为对hasSomeEventOccured的moduleSomethingController发生在与someEvent绑定完成之前。

我的问题是您如何解决这个问题？

我知道，在指令中您将具有以下内容：

link: function(scope, element, attrs) {
   attrs.$observe(...);
}

但是如何在我的情况下实现诸如等待绑定完成之类的功能？

Answer 1

如此-之所以收到“未定义$ scope.someEventApi”错误，是因为您没有在任何地方进行设置。 它是不确定的！ 您在控制器内部使用的所有东西都应该被定义（var x = something ...）或注入（就像您在示例中注入$ scope一样）

我的看法是，您有两种选择来获得想要的东西：

1. 一种常见而直接的方法是在控制器内部定义函数，然后将该函数发送到指令。 这意味着您需要添加以下指令定义：

scope: {theEventOccured: '&' }

＆符号表示它是一个功能。

在您的控制器内：

$scope.theEventOccured = function() { /* your code here */ }

这样-API实际上是在您的控制器中定义的，该指令在需要时使用它。

1. 对于更复杂的东西，您可以创建一个.factory并将其绑定到您的控制器和指令。

2. 如果您尝试在不同的控制器（或指令的控制器）之间进行通信，则可以使用工厂事件或$ broadcast事件。 请参阅作用域api中的 $ broadcast和$ emit

还有两点重要的事情：通常，如果我了解要实现的目标，则不应在父控制器作用域中使用指令的功能，这里不需要$ observe。