$ modal窗口内的指令抛出“undefined is not a function”

时间:2014-02-26 17:23:40

标签: angularjs angular-ui-bootstrap

使用ui-bootstrap我有一个非常简单的自定义指令,它在页面顶部列出警报。在普通页面上,它就像一个冠军。当我在$ modal弹出窗口中使用我的指令时,我在ngRepeatAction中得到“undefined is not function”。

我在主页面上的模态后面的指令仍然有效。我可以在模态背后看到它。它只是模态弹出窗口中的一个。我做错了什么?

模态开放代码:

$modal.open({
            templateUrl: 'partials/main/servers/serverAuths/edit.html',
            controller: function($scope, $modalInstance) {
                $scope.auth = angular.copy(auth);
                $scope.auth.password = null;

                $scope.saveAuth = function() {
                    Auths.editAuth($scope.auth).then(
                        function(resp) {
                            if (resp.rc===0) {
                                Alerts.addAlert('success', 'Auth `'+$scope.auth.name+'` saved.');
                                _.extend(auth, $scope.auth);
                                $modalInstance.close();
                            } else {
                                Alerts.addAlert('danger', 'Auth `'+$scope.auth.name+'` could not be saved. ' + resp.message, 'serverAuths');
                            }
                        }
                    );
                };

                $scope.resetAuth = function() {
                    $modalInstance.close();
                };
            }
        }).result.then(
                function() {
                    Auths.getAuthList().then(
                        function(resp) {
                            $scope.auths = resp;
                        }
                    );
                }
            );

指令模板:

<div class="alert-wrapper alert-{{ alert.type }}"
 ng-repeat="alert in alerts"
 ng-class="{ 'relative':relative }">
<div class="container">
    <div alert type="alert.type" close="closeAlert($index)">{{alert.msg}}</div>
</div>
</div>

指令代码:

angular.module('app')
.directive('appAlerts', function() {
    return {
        restrict: 'A',
        replace: true,
        scope: {
            watchForm: '=',
            relative: '@'
        },
        templateUrl: 'partials/directives/appAlerts.html',
        controller: function($scope, Alerts) {
            $scope.closeAlert = function(idx) { Alerts.closeAlert(idx); };
            $scope.alerts = Alerts.getAlerts();
        }
    };
});

警报工厂:

angular.module('app').factory('Alerts', function($timeout) {
var alerts = [];

function timeoutAlert(a) {
    $timeout(function() {
        a.splice(0, 1);
    }, 2500);
}

var addAlert = function(type, msg) {
    alerts.push({type:type, msg:msg});
    timeoutAlert(alerts);
};

var closeAlert = function(index) {
    alerts.splice(index, 1);
};

var getAlerts = function() {
    return alerts;
};

var killAlert = function(msg) {
    var alert = _.where(alerts, {msg:msg});
    var idx = _.indexOf(alerts, alert[0]);
    if (idx > -1) {
        closeAlert(idx);
    }
};

return {
    addAlert:addAlert,
    closeAlert:closeAlert,
    getAlerts:getAlerts,
    killAlert:killAlert
};
});

0 个答案:

没有答案