栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 面试经验 > 面试问答

一个元素的多个指令可以共享一个隔离范围吗?

面试问答 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

一个元素的多个指令可以共享一个隔离范围吗?

我建议您通过辅助指令的require属性利用指令之间的通信。第一个指令(e指令)保存隔离的作用域,而第二个辅助指令(a指令)具有对第一个指令的引用,并通过在第一个指令上定义的函数设置属性。一个小例子是(请参阅punker):

<!DOCTYPE html><html ng-app="plunker">  <head>    <meta charset="utf-8" />    <title>AngularJS Plunker</title>    <script>document.write('<base href="' + document.location + '" />');</script>    <link rel="stylesheet" href="style.css" />    <script data-require="angular.js@1.2.x" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular.min.js" data-semver="1.2.16"></script>    <script src="app.js"></script>  </head>  <body ng-controller="MainCtrl">    <div e-directive config="parentConfig" a-directive></div>  </body></html>

和javascript:

var app = angular.module('plunker', []);app.controller('MainCtrl', function($scope) {  $scope.parentConfig = {};});app.controller('ECtrl', function ( $scope ) {  this.setProp = function(newProp){$scope.config.prop = newProp;};  $scope.$watch('config', function(newProp, oldProp) {    console.log(oldProp, newProp);  });});app.directive('eDirective', function() {  return {    restrict: 'A',    scope: {      config: '='    },    controller: 'ECtrl',    link: function(scope, element, attrs) {      scope.config.prop ="abc";    }  };});app.directive('aDirective', function() {  return {    restrict: 'A',    require: 'eDirective',    link: function(scope, element, attrs,ctrl) {        ctrl.setProp("def");    }  };});


转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/383380.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号