传递给指令的函数不会从调用控制器更新变量

Question

我有一个如下所示的身份验证指令：

function loginModal(jwtHelper, responseStringProvider, loadingScreen, $timeout, $http, $route) {
    return {
        restrict: 'E',
        scope: {
            onLogin: '=method',
            control: '='
        },
        link: linkFunc,
        templateUrl: 'partials/loginModal.html',
        controller: loginCtrl,
        controllerAs: 'loginVm',
        bindToController: true
    };

    function linkFunc(scope, elm, attrs) {
        if (scope.loginVm.onLogin) {
            scope.loginVm.onLogin();
        }
        scope.loginVm.externalControl = scope.loginVm.control || {};
        scope.loginVm.externalControl.authenticate = scope.loginVm.authenticate;
    }
    function loginCtrl($scope) {
        //viewmodel
        var vm = this;

        //bound functions
        vm.authenticate = authenticate;


        function authenticate(functionToRunOnLogin) {
                functionToRunOnLogin(sessionStorage.token, sessionStorage.username).then(function (functionResponse) {
                        loadingScreen.hide();
                        $scope.$apply();
                    }, function (functionResponse) {
                        if (functionResponse.status === 401) {
                            loadingScreen.hide();
                            $('#invalidOperationDialog').modal({ backdrop: 'static' });
                        }
                        });
        }

索引页面中有一个指令实例。该指令的控制器存储在$ scope变量

中

的index.html：

<login-modal control="vm.authenticationControl"></login-modal>

indexController.js：

vm.authenticationControl = {};

$scope.loginDirective = vm.authenticationControl;

要运行需要身份验证的函数，另一个控制器从$ scope变量访问指令的身份验证函数，并传递需要身份验证的函数

settingsController.js

function openAuthDialog(value) {
            settingsVm.currentAction = value;
            $scope.loginDirective.authenticate(authorize);
        };


         function authorize(token, username) {

            switch (settingsVm.currentAction) {
                case settingsVm.globalSettingAction:
                    if (_isUpdated) {
                        return settingsVm.saveGlobalSettings(token, username);
                    }
                    break;
                case settingsVm.edsAddEditAction:
                    return settingsVm.edsAddEditConfirm(token, username);
                    break;
                case settingsVm.edsDeleteAction:
                    return settingsVm.edsDeleteConfirm(token, username);
                    break;
                case settingsVm.updateYellowPod:
                case settingsVm.updateBluePod:
                case settingsVm.updateDrillThrough:
                    return updateImagePath(token, username);
                    break;
            }

        }


         function saveGlobalSettings(token, username) {
            settingsVm.isSaving = true;
            var globalSettings = getCurrentGlobalSettings();

            return GlobalSettings.save(globalSettings, username, token)
                .then(function () {
                    //success
                    GlobalSettings.setGlobalSettingsChanges(globalSettings);
                    _savedGlobalSettings = globalSettings;
                    _isUpdated = false;

                    openDialogModal('Global Settings have been updated successfully.');
                },
                function () {
                    //error
                    openDialogModal( 'There was an error updating Global Settings at this time. Please try again later.');
                });
        }

         function openDialogModal( message) {
            settingsVm.modalMessage = message;
            $('#dialogModal').modal({ backdrop: 'static' });
        }

settings.html：

 <div id="dialogModal" class="modal fade" data-keyboard="false" style="z-index: 30000">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    Update Result
                </div>
                <div class="modal-body">
                    <h4>
                        <span ng-bind-html="settingsVm.modalMessage"></span>
                    </h4>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-primary" ng-click="globalSettingsVm.closeDialogModal()">OK</button>
                </div>
            </div>
        </div>
    </div>

传递给指令的大多数函数只需要一个令牌来调用后端。该指令提供该令牌并运行该函数，后端更新数据库。 但是有一些需要进行前端更改，这就是问题出现的地方。

成功保存设置后，settingsVm.saveSettings功能会尝试设置settingsVm.modalMessage，但页面没有变化。 我已经介入，可以看到settingsVm.modalMessage得到更新，所以我知道功能正常运行，但无法弄清楚为什么它没有反映在页面上。我怀疑指令的范围没有正确设置，因此当settingsVm.modalMessage更新时，它不在父范围内，这意味着settingsVm.modalMessage的实例未绑定到html。我的另一个想法是我没有正确使用$scope.$apply

我已经为指令尝试了许多不同的范围设置，但没有任何效果。任何建议将不胜感激