javascript - 父作用域未绑定(bind)到自定义指令 iso 作用域

Question

这是我的指令:

(function() {
    angular.module('commentsDirective', [])

    .directive('mngComments', mngComments)

    function mngComments() {
        return {
            restrict: 'AE',
            scope: { },
            templateUrl: '/comments/comments.html',
            controller: 'CommentsController',
            controllerAs: 'vm',
            bindToController: {   
                moment: '=',
                comments: '=',
                showComments: '='
            }
        };
    };
})();

以下是我如何使用它并传递值:

<div mng-comments moment="vm.moments[0]" comments="vm.comments" showComments="true"></div>

请注意我如何将“true”硬编码到 showComments 中。然而在我的 comments.html 文件中:

comments {{vm.showComments}}

它显示没有值的 {{vm.showComments}} 它只是评论。 vm.moments 和 vm.comments 已正确传递。

Answer 1

(function() {
    angular.module('commentsDirective', [])

    .directive('mngComments', mngComments)

    function mngComments() {
        return {
            restrict: 'AE',
            scope: { },
            template: '<div>test {{vm.showComments}}</div>',
            controller: function(){},
            controllerAs: 'vm',
            bindToController: {   
                moment: '=',
                comments: '=',
                showComments: '='
            }
        };
    };
})();

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.7/angular.js"></script>

<div ng-app="commentsDirective">
  <div mng-comments
       moment="vm.moments[0]"
       comments="vm.comments"
       show-comments="true">
  </div>
</div>

如注释中所示，只需在 HTML 中使用连字符大小写来表示 javascript 中的绑定(bind)/范围属性。 HTML 不区分大小写，因此使用 - 代替驼峰式大小写。