Question

我在模板中有以下代码：

  <a href=""  ng-ctrl="ThemesCtrl" ng-click="checkThemeContent({{theme}})" ng-repeat="theme in themes" ng-hide="theme[filterProp] !== filterValue" class="list-group-item">
                    <b>{{theme.name}}</b>
                    <span class="themesListIcons">
                        <i class="fa fa-check-square-o"></i> {{theme.avg_score}}
                        <i class="fa fa-comment-o"></i> {{theme.count_of_cards}}
                    </span>
                </a>

调用以下方法：

$scope.checkThemeContent = function(theme) {
        console.log("Trying to get cards for theme id: " +theme.id);
        console.log(theme);

        $scope.selectedTheme = theme;
        if(theme.count_of_cards >0) {
                $rootScope.$emit('detailDisplayed', {});
                $scope.displayedTemplate = 'detail';
        } else {
            $scope.displayedTemplate = 'empty';
        }
    };

问题是，点击是执行方法中的代码后， $ scope.displayedTemplate 的范围发生了变化，但是没有显示模板，第二次点击后一切正常。

我不知道是什么原因导致这种行为。

有人可以告诉我我做错了吗？

这里是div，其中包含基于displayedTemplate范围的视图：

 <div class="col-md-8" ng-controller="CardsCtrl">
                <!-- ADD TEMPLATE -->
                <div ng-if="displayedTemplate == 'add'" class="header" ng-include src="'/views/themes/add_theme.html'">
                </div>
                <!-- EDIT TEMPLATE -->
                <div ng-if="displayedTemplate == 'edit'" class="header" ng-include src="'/views/themes/edit_theme.html'">
                </div>
                <!-- THEME DETAIL TEMPLATE -->
                <div ng-if="displayedTemplate == 'detail'" class="header"  ng-include src="'/views/themes/detail_theme.html'">
                </div>
                <!-- DEFAULT TEMPLATE -->
                <div ng-if="displayedTemplate == 'default'" class="header"  ng-include src="'/views/themes/default_theme.html'">
                </div>
                <!-- NO CARD TEMPLATE -->
                <div ng-if="displayedTemplate == 'empty'" class="header"  ng-include src="'/views/themes/empty_theme.html'">
                </div>
        </div>

许多建议

Answer 1

我认为问题是你如何将参数传递给函数。传递它就像 ng-click="checkThemeContent(theme);"。

第二次单击时触发Ng单击触发器操作（不是第一次）

1 个答案: