隔离范围＆QUOT; = QUOT;绑定和溺爱符号AngularJS

本文介绍了隔离范围＆QUOT; = QUOT;绑定和溺爱符号AngularJS的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

如何创建一个2的方式与在虚线表示法的分离范围嵌套属性绑定。我以为'myObject.data：=数据将工作，但事实并非如此。我不希望链接在 myObject的对象的一切。我知道我可以做一些手表，但'myObject.data 似乎更清洁。

  .directive（myDirective，[功能（）{
    返回{
        限制：E，
        范围： {
            myObject.data：=数据
        }，
        链接：功能（范围，元素，ATTRS）{            scope.myObject = {
                 数据：myvalue的
            };
        }
     };
 }]）

解决方案

 隔离范围一般只使用模板是有用的，他们不应该被用来作为一种方式来宣告你的指令，你怎么想的属性是间preTED。这是因为没有一个模板最指令通常需要或者子范围或他们的环境的直接范围的语义。
在你的情况，你可能甚至不需要一个$手表，因为对象引用是什么使2路数据绑定，但没有完整的code我不能肯定。
如果你想知道一个孤立的范围语义翻译只是一个正常的：
  @name  - ＆GT; attrs.name
=名字 - ＆GT; 。$ $范围的eval（attrs.name）;
＆安培;名字 - ＆GT;函数（）{$返回$范围的eval（attrs.name）。 }
 
编辑2：
您的评论后，我想出了这个。以preserve双向数据绑定，你必须使用一个。在NG-模型声明。这是因为双向数据绑定值类型是不行的，因为它们是不可变的。你不能改变100的值，例如。你需要绕过引用类型的对象，并挂你改变了它的价值。您指定的完整路径在隔离范围定义的价值的愿望是不可能的基于双向数据绑定是通过成为可能的原则。
使用Javascript：
  angular.module（'plunker'，[]）.directive（'双向'，函数（）{
  返回{
    限制：'E'，
    模板：'＆LT; DIV＆GT;＆LT;输入NG模型=thing.name类型=文本/＆GT;＆LT; / DIV＆GT;，
    范围： {
      事：=
    }，
    链接：功能（范围，元素，ATTRS）{
    }
  };
}）.controller（'MainCtrl'，函数（$范围）{
  $ scope.data = {
    名称：世界
  };
}）;
 
 HTML 
 ＆LT;机身NG控制器=MainCtrl＆GT;
    ＆所述p为H.;你好{{data.name}}＆下;！/差异无显着
    ＆LT;双向事=数据＆GT;＆LT; /双向＆GT;
  ＆LT; /身体GT;
 
How do you create a 2 way binding with a nested property in an isolate scope with dotted notation. I thought 'myObject.data': "=data" would work, but it does not. I don't want to link everything in the myObject object. I know I could do some sort of watch, but 'myObject.data' seems cleaner.  
.directive("myDirective", [function() {
    return {
        restrict: "E",
        scope: {
            'myObject.data': "=data"
        },
        link: function (scope, element, attrs) {

            scope.myObject = {
                 data: "myValue"
            };
        }
     };
 }])
 解决方案 
Isolated scopes are generally useful only with templates, they should not be used as a way to declare how you want your directive attributes to be interpreted. This is because most directives that don't have a template usually need the semantics of either a child scope or the direct scope of their environment.
In your case, you probably don't even need a $watch, because object references are what enable 2 way data binding, but without your full code I cannot be sure.
In case you want to know the translations for an isolated scope semantics to just a normal one:
@name -> attrs.name
=name -> $scope.$eval(attrs.name);
&name -> function() { return $scope.$eval(attrs.name); }
EDIT 2:
After your comment, I came up with this plunker. To preserve two way data binding you have to use a "." in your ng-model declaration. This is because two way data binding does not work for value types, since they are immutable. You can't change the value of 100 for example. You need to pass around a reference type object and hang the values you are changing off of it. Your desire to specify the full path to the value in the isolated scope definition is not possible based on the principles that two way data binding is made possible by.
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>
                        
这篇关于隔离范围＆QUOT; = QUOT;绑定和溺爱符号AngularJS的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！