Question

鉴于

<my-component my-attr="parentModel">

以及包含以下内容的指令定义：

scope: { localModel:'<myAttr' }

有角will set up a one time binding。这意味着什么

表达式在父范围的上下文中进行评估

和

隔离范围属性localModel将反映父范围上parentModel的值。对parentModel的任何更改都将反映在localModel中，但localModel中的更改不会反映在parentModel中

这很好，但是如果使用符号表示法（即&）使用角度表达式已经实现了什么，那么有什么用呢？

给出

<my-component my-attr="parentModel">

以及包含以下内容的指令定义：

scope: { getModel:'&myAttr' }

对scope.getModel()的任何调用也应该在父作用域的上下文中评估"parentModel"表达式，并将该值提供给指令的隔离范围，这里不需要{{1 }} $watch或者担心隔离范围中的值会传播回父级。

Answer 1

我制作了这段代码，试图更好地理解这个问题。似乎两个选项之间存在明显的差异，例如link函数的处理方式和某些自动$watch()ing。但是我从来没有用这种表达方式，我想我错过了什么。

＆＃13;

var app = angular.module('app', []);

app.controller('MainCtrl', function() {
  this.v1 = 1;
  this.v2 = 2;
  this.v3 = 3;
});

app.directive('myComponentOne',
  function() {
    return {
      restrict: 'E',
      scope: { v: "<val" },
      template: '<input ng-model="v"/>',
      link: s => s.v = 99
    };
  });

app.directive('myComponentTwo',
  function() {
    return {
      restrict: 'E',
      scope: { v: '&val' },
      template: '<input ng-model="v"/>',
      link: s => s.v = 99
    };
  });

app.directive('myComponentThree',
  function() {
    return {
      restrict: 'E',
      scope: { v: '=val' },
      template: '<input ng-model="v"/>',
      link: s => s.v = 99
    };
  });

＆＃13;

<div ng-app="app">
  <div ng-controller="MainCtrl as main">
    <div>
      One-way binding:<br>
      parentScope=<input ng-model="main.v1" /><br>
      localScope=<my-component-one val="main.v1"></my-component-one>
    </div>
    <hr>
    <div>
      Expression:<br>
      parentScope=<input ng-model="main.v2" /><br>
      localScope=<my-component-two val="main.v2"></my-component-two>
    </div>
    <hr>
    <div>
      Two-way binding:<br>
      parentScope=<input ng-model="main.v3" /><br>
      localScope=<my-component-three val="main.v3"></my-component-three>
    </div>
  </div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.1/angular.min.js"></script>

＆＃13;

为什么使用angular的一次性绑定少于符号（即`＆lt;`）引入1.5？

1 个答案: