如何从“指令”控制器更新“$scope”对象

Question

我正在尝试从控制器更新 $scope 对象，但它没有更新。但在控制台中我正在更新状态。

这是我的代码：

var galleryMenu = ['$route', function ($route) {

    return {

        scope : true,

        replace : true,

        template : function () {

            var page = $route.current.className || 'home';

            return galleryMenuItem(page);

        },

        controller : function ($scope, $element) {

            $scope.galleryProject = function () {

                $scope.galleryShow = !$scope.galleryShow;
                console.log($scope.galleryShow) //gives me true, but `DOM` not updating.

            }


        }

    }

}];

Answer 1

您的指令正在使用 scope: true，这意味着您已经创建了一个原型继承自父范围的范围。

那么你的 galleryShow 对象应该跟在 dot rule

之后

$scope.model = {};
$scope.model.galleryShow = 'something';

那么在你的指令中，你可以通过原型继承获得 $scope.model 对象，你可以通过 $scope.model.galleryShow 更改它，将更改父范围。

指令控制器

controller : function ($scope, $element) {
     $scope.galleryProject = function () {
         $scope.model.galleryShow = !$scope.galleryShow;
         console.log($scope.model.galleryShow) //gives me true, but `DOM` not updating.
     }
  }