angular 隔离指令的作用域

避免重复使用controller

solate scope

var app = angular.module('myApp', []);

app.controller('Ctrl', function($scope) {
    $scope.naomi = {
      name: 'Naomi',
      address: '1600 Amphitheatre'
    };
    $scope.igor = {
      name: 'Igor',
      address: '123 Somewhere'
    };
  })
  .directive('myCustomer', function() {
    return {
      restrict: 'E',
      scope: {
        customer: '=customer'
      },
      template: 'Name: {{customer.name}} Address: {{customer.address}}'
    };
  });



<body ng-app="myApp">
  <div ng-controller="Ctrl">
    <my-customer customer="naomi"></my-customer>
    <hr>
    <my-customer customer="igor"></my-customer>
  </div>
</body>

关键在于:

scope: {
  customer: '=customer'
},

简化:

scope: {
  // same as '=customer'
  customer: '='
},
最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容