访问另一个控制器的$ scope - AngularJS中的ngDialog

Question

我正在实例化ngDialog，如下所示;

ngDialog.open({
    template: 'mod-details',
    className: "ngDialog-theme-large",
    showClose: false,
    closeByDocument: false,
    closeByEscape: false,
    controller: ['$scope', function($scope) {
        // controller logic
        $scope.isValid = true;
        $scope.orderItem = orderItem;
        $scope.countSelection = function() {
            var count = 0;
            angular.forEach($scope.modifier.menu_modifier_items, function(item){
                count += item.selected ? 1 : 0;
            });
            console.log(item);
            return count;
        }
    }]
});

然后我将$scope.orderItem与ng-repeat一起使用，如下所示;

<div ng-repeat="modifier in orderItem.menu_modifier_groups">
        <div class="menu--modifiers-group" modifier="modifier">
            <div class="group-title" ng-class="{'group-hasError': !isValid}">
                <div class="title-s ng-binding" ng-bind="modifier.name"></div>
                <div class="clearfix"></div>
                <span class="text-muted ptop5" ng-if="modifier.instruction" ng-bind="modifier.instruction"></span>
            </div>

            <div class="group-items" ng-if="modifier.max_selection_points > 1 || (modifier.max_selection_points == 1 && modifier.min_selection_points == 0)">
                <div ng-repeat="item in modifier.menu_modifier_items" class="modifier-item multiple">
                    <label for="<%modifier.id + '_' + item.id%>" ng-click="modifierClicked(item)">
                        <input id="<%modifier.id + '_' + item.id%>"
                               class="checkbox-branded"
                               type="checkbox"
                               name="<%item.name%>"
                               ng-model="item.selected"
                               ng-class="{'not-available': !item.available}"
                               title="<%item.name%>"
                               value="<%item.id%>"
                               ng-disabled="!item.selected && countSelection() == modifier.max_selection_points"
                               ng-click="modifierClicked(item)"
                               ng-change="modifierSelected(item, false)">
                <span class="item-name">
                    <span ng-bind="item.name"></span>
                    <span ng-bind="priceDelta(modifier, item)"></span>
                </span>
                    </label>
                </div>
            </div>
        </div>
    </div>
</div>

我无法访问我modifier函数中ng-repeat="modifier in orderItem.menu_modifier_groups"或modifier.menu_modifier_items ng-repeat="item in modifier.menu_modifier_items"中的countSelection

我附上了ng-inspector的截图。

Answer 1

$ scope.modifier永远不会创建到您的控制器中。您的countSelection函数无法通过这种方式知道正在选择哪个数组项。你可以做的一种方法是在调用时将数组的引用传递给你的函数。像这样：

countSelection(modifier.menu_modifier_items);

而且，在控制器上：

$scope.countSelection = function(selection) {
        var count = 0;
        angular.forEach(selection, function(item){
            count += item.selected ? 1 : 0;
            console.log(item);
        });
        return count;
    }