0

私は次のhtmlを持っています:

<div ng-show=showMarketingNav>
    ...
</div>

<div ng-show=showProductsNav>
    ...
</div>

<div ng-show=showSettingsNav>
    ...
</div>

私がやりたいことは、div の 1 つを除くすべてを別のコントローラーから簡単に非表示にできるようにすることです。私は賢く、次のことができると思いました:

var subNavMenuDisplays = {
    Marketing: $scope.showMarketingNav,
    Products: $scope.showProductsNav,
    Settings: $scope.showSettingsNav
}

$rootScope.hideContextMenu = function () {
    for (var category in subNavMenuDisplays) {
        subNavMenuDisplays[category] = false;
    }
}

$rootScope.setContextMenu = function (name) {
    $rootScope.hideContextMenu();
    subNavMenuDisplays[name] = true;
}

$scope.showMarketingNav などは参照ではなく値として渡されるため、これは明らかに機能しません。

以下は動作しますが、うまく動作するわけではありません:

$rootScope.hideContextMenu = function () {
    $scope.showMarketingNav = false;
    $scope.showProductsNav = false;
    $scope.showSettingsNav = false;
}

$rootScope.setContextMenu = function (name) {
    $rootScope.hideContextMenu();
    if (name == "Marketing") {
        $scope.showMarketingNav = true;
    }
    if (name == "Products") {
        $scope.showProductsNav = true;
    }
    if (name == "Settings") {
        $scope.showSettingsNav = true;
    }
}

参照によって $scope.showMarketingNav を取得する方法、またはこれを回避する別の賢い方法はありますか?

変数名を連結するために eval を使用しないことをお勧めします。

4

2 に答える 2