AngularJS UI Bootstrap dismiss()无法正常工作

卡斯珀·尼布鲁(Casper Nybroe)

首先,我要说我对棱角还很陌生。我试图设置一个可以正常工作的模式用户界面。但是,当我单击界面上的“取消”按钮时,没有任何反应。

这是我的代码:

    (function () {
        var domainName = 'TournamentCategory';
        angular.module('tournamentCategories').controller("CategoriesController",
        ['$scope', '$modal', 'guidGenerator', 'eventBus', domainName + "Service",                    
        'TournamentCategoryModelFactory',
        function ($scope, $modal, guidGenerator, eventBus, domainService, modelFactory)  
        {$scope.openTournamentTree = function () {


        var modalInstance = $modal.open({
            templateUrl: 'TournamentTreeModal.html',
            controller: 'TreeController',
            size: 'wide-90',
            resolve: {

            }
        });

        modalInstance.result.then(function (selectedItem) {
            //$scope.selected = selectedItem;
        }, function () {
            //$log.info('Modal dismissed at: ' + new Date());
        });
        };

        $scope.ok = function () {
        modalInstance.close();
        }

        $scope.cancel = function () {
        modalInstance.dismiss('cancel');
        };
        }]);
    })();

HTML:

<script type="text/ng-template" id="TournamentTreeModal.html">
<div class="modal-header">
</div>
<div class="modal-body">
    <div class="include-tree" ng-include="'tournament-tree.html'"></div>
</div>
<div class="modal-footer">
    <button class="btn btn-primary" ng-click="ok()">GEM</button>
    <button ng-click="cancel()" class="btn btn-warning" type="button" data-dismiss="modal">LUK, uden at gemme</button>
</div>

这是我的“ treeController”

angular.module('tournamentTree').controller("TreeController", ['$scope', 'guidGenerator', function ($scope, guidGenerator) {
$scope.allMatches = [];
$scope.finalMatch = [createNewMatch()];
$scope.tierCount = 1;
$scope.previousMatchTier = 0;

$scope.deletePreviousMatches = function (parentMatch) {
    for (var i in parentMatch.previousMatches) {
        var previousMatch = parentMatch.previousMatches[i];
        _.remove($scope.allMatches, function (match) { return match.id == previousMatch.id });
    }
    parentMatch.previousMatches = [];
}


$scope.addMatches = function (thisMatch) {
    if (thisMatch && !thisMatch.previousMatches)
        thisMatch.previousMatches = [];
    if (thisMatch && thisMatch.previousMatches.length == 0) {
        thisMatch.previousMatches.push(createNewMatch(thisMatch));
        thisMatch.previousMatches.push(createNewMatch(thisMatch));
    }
}

$scope.addMatchTier = function () {
        for (var i in $scope.allMatches) {
            var match = $scope.allMatches[i];
            if (match.previousMatches.length == 0) {
                $scope.addMatches(match);
            }

        }
        $scope.tierCount++;
}

$scope.previousMatchTier = function () {
    for (var i in $scope.allMatches) {
        var previous;
        if (previous.allMatches.length == i) {
            previous = $scope.allMatches[i] - $scope.allMatches[i - 1];
        }
    }
}

$scope.removeMatchTier = function () {
    //if (confirm('Er du sikker på, at du vil slette det yderste niveau af turneringstræet?')) {
    var matchesToDelete = [];
    for (var i in $scope.allMatches) {
        var match = $scope.allMatches[i];
        if (match.previousMatches.length == 0) {
            matchesToDelete.push(match.nextMatch);
            //$scope.deletePreviousMatches(match.nextMatch);
        }
    }

    for (var i in matchesToDelete) {
        $scope.deletePreviousMatches(matchesToDelete[i]);
    }
    $scope.tierCount--;
    //}
}

$scope.hasPreviousMatches = function (match) {
    return match && match.previousMatches && match.previousMatches.length > 0;
}

$scope.moveWinnerToNextMatch = function (match, winnerName) {
    match.nextMatch.setPlayerName(match.id, winnerName);
}

function createNewMatch(nextMatch) {
    var newMatch = {};
    newMatch.tier = nextMatch && nextMatch.tier ? nextMatch.tier + 1 : 1;
    newMatch.id = guidGenerator.newGuid();
    newMatch.player1 = "";
    newMatch.player2 = "";
    newMatch.nextMatch = nextMatch;
    newMatch.previousMatches = [];
    newMatch.setPlayerName = function(matchId, playerName) {
        for (var i in newMatch.previousMatches)
        {
            if (newMatch.previousMatches[i].id == matchId)
            {
                if (i == 0)
                    newMatch.player1 = playerName;
                else
                    newMatch.player2 = playerName;
            }
        }
    }

    $scope.allMatches.push(newMatch);
    return newMatch;
}
}]);
玛雅克

$ dismiss在模态范围内已经可用,因此在模板raplace cancel()和$ dimiss()中可以使用http://angular-ui.github.io/bootstrap/#/modal

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

AngularJS + UI-Bootstrap模式无法正常工作

来自分类Dev

AngularJS UI Bootstrap DatePicker无法正常运行

来自分类Dev

ui-bootstrap Datepicker无法正常工作

来自分类Dev

ui-bootstrap Datepicker无法正常工作

来自分类Dev

Kendo UI和AngularJS Notification CSS无法正常工作

来自分类Dev

添加AngularJS后Bootstrap Scrollpy无法正常工作

来自分类Dev

UI Bootstrap Modal弹出窗口无法与AngularJS一起正常使用

来自分类Dev

AngularJS UI Bootstrap模态无法从作用域执行功能

来自分类Dev

AngularJS UI Bootstrap模态无法从作用域执行功能

来自分类Dev

AngularJs:如何使ui-select正常工作?

来自分类Dev

angularjs无法正常工作

来自分类Dev

Angularjs 无法正常工作

来自分类Dev

jQuery UI + Bootstrap 3可排序手风琴无法正常工作

来自分类Dev

jQuery UI可排序包含在AngularJS中无法正常工作

来自分类Dev

如何删除UI Bootstrap Datepicker页脚AngularJS

来自分类Dev

AngularJS UI Bootstrap选项卡示例

来自分类Dev

AngularJS + UI Bootstrap Typeahead实现问题

来自分类Dev

javascript-AngularJS-UI Bootstrap Datepicker

来自分类Dev

UI Bootstrap Modal不会关闭。AngularJS

来自分类Dev

无法注入UI Bootstrap

来自分类Dev

ui-bootstrap-tpls-2.0.2 Carousel AngularJS工作时出现问题

来自分类Dev

angularjs ui-bootstrap手风琴无法平滑过渡/滑动

来自分类Dev

在AngularJS中搜索无法与Angular Bootstrap UI一起使用

来自分类Dev

angularjs ui-bootstrap手风琴无法平滑过渡/滑动

来自分类Dev

angularjs中的选项卡无法与UI-Router和UI-bootstrap一起使用

来自分类Dev

Storm UI无法正常工作

来自分类Dev

尝试让ui.bootstrap下拉菜单正常工作

来自分类Dev

Bootstrap Markdown无法正常工作

来自分类Dev

Bootstrap Popover无法正常工作

Related 相关文章

热门标签

归档