Angular 指令自己的范围

Question

我有以下指令

<preload loaded="false" ng-if="!loaded"></preload>

return {

            restrict: 'E',
            templateUrl: 'template.html',
            scope: {
                loaded: '='
            },


            link: function(scope, element, attrs) {        
                //scope.loaded = true
                //hide directive
            }

        }

在任何控制器之外。

我的问题是，我可以在 link 函数中将 loaded 更改为 true 并且指令会消失吗？

Answer 1

您的意思是通过单击按钮等操作更改值吗？如果是：

我认为您可以像切换任何其他值一样切换该值。可以传递的第四个参数是控制器。

link: function(scope, element, attrs, ctrl) {
  scope.loaded = true;
  scope.toggle = function() {
    scope.loaded = !scope.loaded;
  };
}

然后您可以将 scope.toggle 分配给按钮。或者你的意思是当 link 函数是运行时只改变值？

编辑

这是一个快速的 plunkr，展示了你为 angular 1.5 编写的意思：

https://plnkr.co/edit/6nj4N6LdGULv7vX4EUqs?p=preview

编辑 2 我的 plunkr 第 13-20 行：

angular
    .module('app')
    .controller('PreloadCtrl',PreloadCtrl);

  function PreloadCtrl() {
    var vm = this;
    vm.loaded = false;
  }

这基本上定义了一个名为 PreloadCtrl 的控制器，并向它传递了一个充当控制器的函数。这和这样做是一样的，这可能是你习惯的：

.controller('PreloadCtrl', function () {//Controller stuff})

Angular 指令自己的范围

Angular directive own scope

javascript

directive

angularjs