Question

如何使用点分表示法在隔离范围中创建具有嵌套属性的双向绑定。我认为'myObject.data': "=data"会起作用，但事实并非如此。我不想链接myObject对象中的所有内容。我知道我可以做某种手表，但'myObject.data'似乎更清洁。

.directive("myDirective", [function() {
    return {
        restrict: "E",
        scope: {
            'myObject.data': "=data"
        },
        link: function (scope, element, attrs) {

            scope.myObject = {
                 data: "myValue"
            };
        }
     };
 }])

Answer 1

隔离范围通常仅对模板有用，它们不应用作声明您希望如何解释指令属性的方式。这是因为大多数没有模板的指令通常需要子范围或其环境的直接范围的语义。

在你的情况下，你可能甚至不需要$ watch，因为对象引用是启用双向数据绑定的，但是如果没有完整的代码，我无法确定。

如果您想知道隔离范围语义的翻译只是正常的翻译：

@name -> attrs.name
=name -> $scope.$eval(attrs.name);
&name -> function() { return $scope.$eval(attrs.name); }

编辑2：

在您发表评论后，我想出了plunker。要保留双向数据绑定，您必须使用“。”。在您的ng-model声明中。这是因为双向数据绑定不适用于值类型，因为它们是不可变的。例如，您无法更改值100。您需要传递一个引用类型对象并挂起您正在更改它的值。基于可以通过双向数据绑定的原则，您无法在隔离范围定义中指定值的完整路径。

使用Javascript：

angular.module('plunker', [])

.directive('twoWay', function() {
  return {
    restrict: 'E',
    template: '<div><input ng-model="thing.name" type="text" /></div>',
    scope: {
      thing: "="
    }, 
    link: function(scope, element, attrs) {
    }
  };
})

.controller('MainCtrl', function($scope) {
  $scope.data = {
    name: "World"
  };
});

HTML：

  <body ng-controller="MainCtrl">
    <p>Hello {{data.name}}!</p>
    <two-way thing="data"></two-way>
  </body>

Answer 2

我在这些情况下使用的内容如下：

.directive("myDirective", [function() {
    return {
        restrict: "E",
        scope: {
            data: "="
        },
        controller: function($scope){
           $scope.dot = $scope //<--- here is the trick
        } 
     };
 }])

然后，您可以随时将指令范围内的data从继承范围更改为dot.data = 'whatever'而不设置观察者。

不是很优雅，但如果你没有使用controller as语法并且不想要$parent噩梦，它会很好用。

隔离范围“=”绑定和溺爱符号AngularJS

2 个答案: