javascript - 如何在隔离范围内创建嵌套对象

Question

所以我想在指令内的嵌套范围内创建一个嵌套结构，如下所示:

angular.module('myAddress').directive('myAddress', [function () {
    return {
        restrict: 'AE',
        controller: 'myAddressController',
        templateUrl: 'my-address.html',
        scope: {
            address: {
                'form': '=addressForm',
                'model': '=addressModel'
            }
        }
    };
}]);

但我得到一个异常，即 undefined 不是一个函数，如果我删除地址嵌套，我将得不到该函数。

如何将属性参数放入作用域的命名键中？

此外，如果我通过 Controller 定义 $scope.address 它也不起作用。但是什么会先执行呢？范围:我的指令或 Controller 的 $scope.form 中的 { 'form' = 'addressForm'} 部分？

Answer 1

使用 scope 属性，您可以定义哪些 $scope 变量应该传递给指令 scope 以及数据绑定(bind)的类型。

如果你想在指令 $scope 中创建一个嵌套结构，你可以在指令 controller 函数中创建它。

例如:

angular.module('myAddress').directive('myAddress', [function () {
return {
    restrict: 'AE',
    controller: 'myAddressController',
    templateUrl: 'my-address.html',
    scope: {
            addressForm: '=',  // Two-way databinding
            addressModel: '='
    },
    controller: function($scope){
         $scope.address = {
            form: $scope.addressForm,
            model: $scope.addressModel
         }
    },
    link: function($scope,$element,$attributes){
           //Your code here
    }
  };
}]);

您还可以在模块 Controller scope 中定义 $scope.address。那么指令中的 scope 属性应该是这样的

scope: { 
       address: '='
}

更新:

另一个问题是:您的指令是否需要专用范围？如果不是，您可以设置 scope 属性 false。然后您的指令可以访问模块 Controller 中的 $scope 变量。