Question

这看起来像一个简单的问题，但我无法找到接近它的最佳方法：

总体情况：我希望有一个可重复使用的地址模板，并在需要地址块时将其包含在其他模板中（使用grunt-includes）。为了使地址模板独立且可重复使用，我已经为其附加了一个地址控制器，其内部模型称为addressModel。

问题：我有一个页面，其中包含可重复使用的AngularJS 地址模板TWICE：一个地址将用于结算，另一个地址用于运送。

问题：如何自定义每个块以在父控制器的范围内处理自己的相应模型？换句话说，从父控制器我想说第一个地址块的模型是$scope.billingAddress而第二个地址块的模型链接到$scope.shippingAddress，知道每个地址控制器里面我只有$scope.addressModel可以访问他们的本地addressModel，我无法从任何{{1}}用于当前控制器的子控制器中获知。

Answer 1

为此，您应该使用具有隔离范围的指令。示例：

angular.module('some-module', []).directive('address', function () {
    return {
        restrict: 'EA',
        scope: {
            address: '=data'
        },
        template: '<ul><li>{{ address.city }}</li><li>{{ address.street }}</li></ul>' //or you can use 'templateUrl'
    };
});

简单用法：在模板中插入：<address data="billing.address"></address>

您可以在此处看到扩展示例：jsbin

有关指令的更多信息：https://docs.angularjs.org/guide/directive

希望它会对你有帮助。

同一控制器，两种不同的型号

1 个答案: