Question

国家这样宣布。正如你所看到的，有一个名为＆＃34; market＆＃34;有一个名为＆＃34; list＆＃34;的子状态。它们共享控制器，但具有不同的模板。

.state('market', {
            url: '/market',
            templateUrl: '/market',
            controller: 'MarketController',
            access: { requiredLogin: true }
        }).state('market.list', {
            url: '/list',
            templateUrl: '/market/list',
            controller: 'MarketController',
            access: { requiredLogin: true }
        })

在控制器中，我声明了一个变量$ scope.activeProduct，可以通过点击＆＃34;市场中的按钮修改其值。*＆＃34;。

我在两个模板中都放置了{{activeProduct}}。单击该按钮时，该值仅在＆＃34;市场中发生变化。*＆＃34;部分。

这是单击按钮时触发的功能：

        $scope.switchProduct = function (id) {
        $timeout(function() {
            $scope.$apply(function(){
                    $scope.activeProduct = id;
                    MarketStorageService.activeProduct = id;
                    console.log("activeproduct changed to" + id);
                }
            );
        });
    };

我只是不明白为什么在＆＃34; market.list＆＃34;价值不会改变。

Answer 1

这是angular中范围继承的常见问题。子状态的范围有自己的activeProduct副本，因此在更改时，不会查询继承链的更改。这在What are the nuances of scope prototypal / prototypical inheritance in AngularJS?中都得到了很好的解释。快速修复将引用父作用域上的变量：

$scope.$parent.activeProduct;

在孩子的状态。

UI-Router嵌套模板父变量更改未反映在子项中

1 个答案: