Question

我试图将控制器中的布尔值传递给我的隔离范围指令。当我从指令的链接函数console.log(attrs)时，someBoolean属性是一个字符串，呈现实际文本＆＃34; main.bool＆＃34;而不是真值或假值。当我从外部控制器切换布尔值时，我希望它在指令中更新。

https://plnkr.co/edit/80cvLKhFvljnFL6g7fg9?p=preview

app.directive('myDirective', function() {
    return {
      restrict: 'E',
      replace: true,
      scope: {
        someBoolean: '='
      },
      templateUrl: 'myDirective.html',
      link: function(scope, element, attrs) {
        console.log(scope);
        console.log(attrs);
      },
      controller: function($scope, $element, $attrs) {
        console.log(this);
      },
      controllerAs: 'directiveCtrl',
      bindToController: true
    };
  });

控制器

   app.controller('MainCtrl', function($scope) {
      var vm = this;

      vm.bool = true;
      vm.change = function() {
        vm.bool = !vm.bool;
      }
    });

模板

<div>
  Inside directive: {{someBoolean}}
</div>

Answer 1

由于您已将指令控制器附加到directiveCtrl而不是mainCtrl，因此您将使用someBoolean访问变量directiveCtrl.someBoolean。

在这种情况下，请将HTML更改为：

<div>
  Inside directive: {{directiveCtrl.someBoolean}}
</div>

Plunker

另一种解决方案是删除指令中的bindToController属性。有了这个，您就不需要在变量之前使用控制器名称。工作Plunker。

详细了解此bindToController功能here。

无法使用Angular将布尔值传递给指令

1 个答案: