如果我的 Angular 控制器没有使用任何 $scope，那么我该如何在我的指令中进行 2 路数据绑定

Question

我一直在使用 Angular 而没有 $scope

控制器：

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

requestController.$inject = ['$location','requestService'];

function requestController($location, requestService) {

    var vm = this;
    //......
    var detail = {}; 
    detail.program.....  
}

HTML页面显示值

{{detail.program.code}}    shows   DGAT  on page ...  thus it has value

将其传递到指令中

   <com-code progCode="detail.program.code"></com-code>

应该将值作为双向绑定的指令

(function () {
    var injectParams = ['customerService', '$sce'];

    var comCode = function (customerService, $sce) {
        return {
            replace: true,
            restrict: "E",
            scope: {
                progCode: "="
            },
            link: function (scope, element, attrs) {

                console.log('scope.progCode',scope.progCode);  // UNDEFINED

            }
        };
    };

    comCode.$inject = injectParams;
    angular.module('app').directive('comCode', comCode)
}());

为什么是这个undefined？
是因为控制器中缺少$scope吗？
progCode as 2 way data binding 是否成为指令范围的一部分？

Answer 1

在 HTML 中使用指令时，属性应 破折号分隔 。所以，

<com-code prog-code="detail.program.code"></com-code>

应该可以工作（假设其他一切都准备就绪）！

Answer 2

因为你没有在控制器中添加，所以在 $scope

中设置你的详细信息

$scope.detail = detail;

但是在指令中从 $scope 获取数据 - 是 bag 实践

Answer 3

您缺少控制器，语法见此 PLUNKR

 <div ng-controller="MainCtrl as main">
      <h4>valBit: {{main.data.valBit}}</h4>
    <my-code input-code="main.data.valBit"></my-code>
    <p ng-if="main.data.valBit == 1">
      part of my form,  with ngmessage etc... $erroretc... 
    </p>  
    </div>

当您不使用作用域时，您需要在控制器中使用 this 进行绑定，并在路由中使用 controller as 语法，或者 html 然后使用该引用来调用值

Answer 4

您将 controllerAs 与 vm 变量一起使用，但在这里您没有将 detail 变量绑定到您的 vm 中。所以你不能将细节传递给你的指令。

为此，将详细信息绑定到您的 view/model (vm) 变量：

vm.detail = detail;

进入视图将 vm.detail 绑定到您的指令：

<com-code progCode="vm.detail.program.code"></com-code>

如果我的 Angular 控制器没有使用任何 $scope，那么我该如何在我的指令中进行 2 路数据绑定

If my Angular Controller is not using any $scope, then how do i do 2 way data binding in my directive

javascript

angularjs

angularjs-directive

angularjs-scope

angular-directive