Question

可以定义哪个范围的属性必须分配指令中定义的属性？ e.g：

angular.module("myMod",[]).
directive("myDir", {
    restrict: "E",
    scope: {
        prop1: "@myProp1",
        prop2: "@myProp2",
    },
    controller: function($scope){
        //Here I have prop1 and prop2 assigned to $scope
        $scope.prop1;
        $scope.prop2;
    },
});

但我想要的是：

angular.module("myMod",[]).
directive("myDir", {
    restrict: "E",
    scope: {
        config: { prop1: "@myProp1" }, //This is invalid
        prop2: "@myProp2",
    },
    controller: function($scope){
        //And here, $scope.config.prop1 refers to myProp1
        $scope.config.prop1;
        $scope.prop2;
    },
});

我找到了一个部分解决方案：使用controllerAs和bindToController，controllerAs定义了一个别名来引用控制器，bindToController将隔离的范围属性绑定到控制器，然后我有：

$scope.alias.prop1
$scope.alias.prop2

但我不想将所有属性绑定到控制器，因为我不需要它。我想将它们中的一些绑定到范围的属性，其余的绑定到另一个属性或直接绑定到范围。

我为什么要这样做？因为我想分配： $ scope.config = newConfig;

这比以下更容易：

$scope.prop1 = newProp1;
$scope.prop2 = newProp2;

Answer 1

我没有强烈的想法，只是一个想法。怎么用这样的东西？

var cfg = {prop1: '@myProp1'};
angular.module("myMod",[]).
directive("myDir", {
    restrict: "E",
    scope: {
        config: cfg.prop1,
        prop2: "@myProp2",
    },
    controller: function($scope){
        $scope.config;
        $scope.prop2;
    },
});

Answer 2

我不确定是否可以完全按照您的意愿行事（github angular），但可能适合这样：

angular.module("myMod", []).directive("myDir", function () { return { restrict: "E", scope: { config: "&myConfig", prop2: "@myProp2" }, link: function($scope){ console.log($scope.config(), $scope.prop2); } } });

所以在HTML中你可以定义config：

<div ng-app="myMod"> <my-dir my-config='{config1: "conf1Val", config2: "conf2Val"}' my-prop2="prop2Val">wver</my-dir> </div>

http://jsfiddle.net/xrvpoe4r/2/

另一种方法是定义约定，例如每个配置应该以＆＃34; config - ＆＃34;开头。和make指令，它将根据这些属性在作用域中创建一个新的字段（对象）例如： http://jsfiddle.net/xrvpoe4r/4/

如何定义Angularjs中绑定隔离范围属性的位置？

2 个答案: