从Angular中的子指令访问Controller Scope

时间:2021-09-06 12:50:34

I want to access a controller scope without using $parent. From everything I read, I thought I could just pass it into the isolate scope as follows:

我想在不使用$ parent的情况下访问控制器范围。从我读到的所有内容中,我认为我可以将其传递到隔离范围,如下所示:

  <body ng-app="app" ng-controller="myController">
    <h1>
      {{message}}
    </h1>
    <mydir></mydir>

angular.module('app', [])

.controller('myController', function($scope){
  $scope.message = "Hello World";
})

.directive('mydir', function(){
  return {
    restrict: "E",
    scope: {
      message: "=",
    },
    controller: function($scope){
      $scope.goodbye = function(){
        $scope.message = "Goodbye World";
      }
    },
    template: "<button ng-click='goodbye()'>Say Goodbye</button>"
  }
})

However, I can't get the directive to update the scope's message property. Plnkr link.

但是,我无法获得更新范围的消息属性的指令。 Plnkr链接。

1 个解决方案

#1


4  

Since the isolated scope value can passed using attribute, then you need to have message attribute on directive element which will have the scope variable name.

由于隔离范围值可以使用属性传递,因此您需要在指令元素上具有消息属性,该属性将具有范围变量名称。

<mydir message="message"></mydir>

Demo Plunker

演示Plunker

#1


4  

Since the isolated scope value can passed using attribute, then you need to have message attribute on directive element which will have the scope variable name.

由于隔离范围值可以使用属性传递,因此您需要在指令元素上具有消息属性,该属性将具有范围变量名称。

<mydir message="message"></mydir>

Demo Plunker

演示Plunker