如何在不使用函数的情况下从指令中的NG重复修改控制器范围

Question

我希望ng单击更改控制器范围变量'ControllerLabel'的值。在不使用控制器范围函数的情况下实现这一目标的最佳方法是什么？

html：

<div ng-app="app">
  <div ng-controller="Ctrl">
      <p>{{controllerLabel}}</p>     
     <my-template></my-template>
  </div>
    <!-- my-template.html -->
    <script type="text/ng-template" id="my-template.html">
        <div ng-repeat="clickLabel in clickLabels">
            <label ng-click="controllerLabel = {{clickLabel.text}}">{{clickLabel.text}}</label>
        </div>
    </script>
</div>

javaScript：

angular.module('app', [])
    .controller('Ctrl', function Ctrl1($scope) {
        $scope.controllerLabel = 'Default text';
        $scope.clickLabels = [
            {'text':'Hello'},
            {'text':'World'},
        ];
    })
    .directive('myTemplate', function() {
        return {
            restrict: 'E',
            templateUrl: 'my-template.html'
        };
    });

jsfiddle

Answer 1

您可以将 link添加到指令中，并像：

.directive('myTemplate', function() {
        return {
            restrict: 'E',
            link: function (scope) {
            scope.onClick = function (clickLabel) {
                  scope.controllerLabel = clickLabel.text;
              }
        },
            templateUrl: 'my-template.html'
        };
    });

html

<script type="text/ng-template" id="my-template.html">
        <div ng-repeat="clickLabel in clickLabels">
            <label ng-click="onClick(clickLabel)">{{clickLabel.text}}</label>
        </div>
    </script>

实际上您可以像@alborz发布的那样写入，但我认为将方法添加到链接中，而来自HTML的呼叫将更清晰，易于调试。

demo 小提琴

Answer 2

我更新了您的小提琴； 更新的小提琴

您需要将controllerLabel用作对象属性，使其与控制器具有共享对象。

angular.module('app', [])
    .controller('Ctrl', function Ctrl1($scope) {
        $scope.label = {};
        $scope.label.controllerLabel = 'Default text';
        $scope.clickLabels = [
            {'text':'Hello'},
            {'text':'World'},
        ];
    })
    .directive('myTemplate', function() {
        return {
            restrict: 'E',
            templateUrl: 'my-template.html'
        };
    });

模板：注意到label.controllerLabel = clickLabel.text

<div ng-repeat="clickLabel in clickLabels">
    <label ng-click="label.controllerLabel = clickLabel.text">{{clickLabel.text}}</label>
</div>