gpt4 book ai didi

javascript - 使用一个指令从另一个隔离作用域复制作用域属性

转载 作者:行者123 更新时间:2023-11-28 00:46:15 25 4
gpt4 key购买 nike

基本上,我有一个由两种形式使用的指令。在页面加载时,每个页面都会加载指令设置的默认属性。问题是,两个表单都需要有一个复选框选项才能将相同的属性应用于另一个表单。我为每个表单有两个单独的 html 模板和 Controller 。

return function row(ModelService) {
return {
restrict: 'E',
templateUrl: function(elem, attr) {
return elem.templateUrl;
},
scope: {
formTitle: '@',
type: '@'
},
link: function(scope, elem) {

scope.setDefault = function() {
.
. scope settings defined here
.
.
.
}

scope.close = function (action) {
.
. if(checked) {
. some code needed to apply the settings to the other form
. }
.
.
.
}
};
});
<div ng-controller="app.FirstCtrl">
<propFilter form title="someTitle" template-url="someUrl"></propFilter>
.
. multiple div elements with ng-model
.
.
.
<input id="applyToOther" type="checkbox">
</div>


<div ng-controller="app.secondCtrl">
<propFilter form title="someTitle" template-url="someUrl"></propFilter>
.
. multiple div elements with ng-model
.
.
.
<input id="applyToOther" type="checkbox">
</div>

我想知道的是如果可能的话如何使用相同的指令将一个作用域的属性复制到另一个作用域。任何帮助将非常感激。谢谢!

最佳答案

您可以创建一些工厂来保存您的常用数据。您可以将其注入(inject) Controller 或指令中,这取决于您的用例。

我创建了一些示例来说明这一点:

http://jsbin.com/nibufogayi/1/edit?html,js,output

HTML:

<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.min.js"></script>
<meta charset="utf-8">
<title>JS Bin</title>
</head>
<body ng-app="directiveBroadcast">
<div ng-controller="directiveCtrl1 as ctrl1">
<checkboxes ng-model="ctrl1.checkboxData"></checkboxes>
</div>
<div ng-controller="directiveCtrl2 as ctrl2">
<checkboxes ng-model="ctrl2.checkboxData"></checkboxes>
</div>

<script type="text/ng-template" id="/directive.html">
<div>Directive</div>
<input type="checkbox" ng-model="ngModel.checkbox1" />
<input type="checkbox" ng-model="ngModel.checkbox2" />
</script>
</body>
</html>

JS:

angular.module('directiveBroadcast',  [])
.factory('checkboxData', function() {
return {checkbox1 : true,
checkbox2 : false
};
})
.controller('directiveCtrl1', function(checkboxData){
this.checkboxData = checkboxData;
})
.controller('directiveCtrl2',function(checkboxData){
this.checkboxData = checkboxData;
})
.directive("checkboxes", function() {
return {
restrict: "E",
scope: {
ngModel: "="
},
templateUrl: "/directive.html"
};
});

其他可能性是将其注入(inject)指令或指令中的某些“静态”上下文

关于javascript - 使用一个指令从另一个隔离作用域复制作用域属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27352980/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com