如何从子指令调用AngularJS父指令作用域方法
从子指令调用AngularJS父指令作用域方法可以通过以下步骤实现：
- 在父指令中定义一个方法，并将其绑定到父指令的作用域上。例如，在父指令的控制器中定义一个方法
parentMethod：
app.directive('parentDirective', function() {
return {
restrict: 'E',
controller: function($scope) {
$scope.parentMethod = function() {
// 父指令方法的逻辑
};
}
};
});- 在子指令中使用
require属性来引用父指令，并在链接函数中获取父指令的控制器。例如，在子指令的链接函数中获取父指令的控制器：
app.directive('childDirective', function() {
return {
restrict: 'E',
require: '^parentDirective',
link: function(scope, element, attrs, parentCtrl) {
// 在子指令中调用父指令的方法
parentCtrl.parentMethod();
}
};
});在上述代码中，^parentDirective表示要引用父指令的控制器。
- 在HTML中使用父指令和子指令。例如：
<parent-directive>
<child-directive></child-directive>
</parent-directive>通过以上步骤，子指令就可以调用父指令的作用域方法parentMethod了。
请注意，以上示例代码中的app是一个AngularJS应用的模块，需要根据实际情况进行定义。另外，腾讯云并没有直接相关的产品或产品介绍链接地址与此问题相关。
相关·内容
1回答
我有一个角度控制器CanvasController模拟一个画布，在上面可以放置“小部件”。
控制器维护一个简单的对象文字数组_currentWidgets，该数组对应于画布上当前的小部件。例如[ {id: 1} ]。
CanvasDirective绑定到CanvasController，并在link函数中的数组currentWidgets上放置一个角度监视。这意味着当添加和删除小部件时，将重新呈现画布。
画布模板包含以下行来呈现小部件：
<div ng-include="'widget-template'" ng-repeat="widgetMod
浏览 0提问于2014-08-18得票数 1
我在将一个特定的变量放入我刚刚创建的一个指令的作用域时遇到了问题。这个变量位于上两级的作用域中(即，在我想要访问的作用域和我刚刚创建的作用域之间有另一个作用域)。我的问题是我不知道中介作用域是从哪里来的，也不知道如何将变量传递到这个作用域中，除非我想要的变量在父作用域中。我可以像这样手动完成：
$scope.var = $scope.$parent.$parent.var
但是，如果父父作用域中的变量为空，就会出现问题。更不用说所有这些额外的JavaScript将是乏味和不必要的。现在，我已经通过使用setInterval每5秒检查一次它是否为null来解决这个问题，如果不是，则进行适当的赋值
浏览 1提问于2019-02-19得票数 2
2回答
我有一个应该有isolate作用域的指令和一个parent指令，类似于：
-----------------------------------------------
| parent directive |
| ---------------------------------------- |
| | | |
| | menu directive(isolate scope) | |
| |
浏览 3提问于2015-03-16得票数 0
我写了这段代码。
var app = angular.module('plunker', []);
app.controller('MainCtrl', function($scope) {
$scope.name = 'World';
$scope.hobby='AngularJS';
});
app.directive('outputText',function(){
return {
transclude: true,
scope: {},
template: &#
浏览 2提问于2014-09-30得票数 0
回答已采纳
我已经创建了一个指令，它有一个独立的作用域。不知何故，当我试图从指令的元素中获取作用域时，它给了我控制器的作用域，而不是孤立的作用域。
我的代码出了什么问题？谁能解释一下scope()方法是如何工作的？
这是我的js代码：
angular.module('myApp',[])
.directive('component',function(){
return {
restrict:'EA',
replace:false,
scope:{
浏览 1提问于2014-10-01得票数 0
我使用属性将一个对象从父作用域传递给子作用域，我希望在子作用域中所做的更改被传播到父作用域。
基本上，这是父视图：
<foo oo-bar="object"></foo>
这是foo指令：
angular.module('foo').directive('foo', function()
{
return {
restrict : 'E',
templateUrl : ConfigService.path.views + '/table/projects.ht
浏览 2提问于2015-02-26得票数 0
回答已采纳
如果a和b是我的指令，那么b是a的子元素：
<a>
<b></b>
</a>
如果a有一个独立的作用域，那么b可以继承它吗？
示例js：
app.directive('a', function () {
return {
restrict: 'E',
scope: {},
controller: function ($scope) {
$scope.prop1 = ...
}
}
});
app.directive('b', function
浏览 4提问于2015-07-20得票数 2
回答已采纳
下面是通过AngularJS验证ngForm的一个典型示例：
<form name="parentForm">
<div ng-form="childForm">
<input ... />
<span class="error" ng-if="childForm.$invalid && (childForm.$dirty || parentForm.$submitted)">...</span>
</div>
..
浏览 0提问于2015-03-03得票数 1
回答已采纳
我有一个静态/可变的json请求模板，当我通过一个$http POST工厂从一个控制器发送一个$http post请求时，我正在使用它。问题是，devtools范围内的模型数据不会与模板的其余部分一起传递。示例如下。任何惊人的见解都会是..。真是太神奇了。
var a = 'a';
var b = $scope.b;
var c = $scope.c;
$rootScope.requestData =
[
{
"key": a, // Binds on submission = I'm happy
浏览 0提问于2013-07-19得票数 0
2回答
我很困惑指令是如何工作的，我有一种感觉，我不正确地使用它们。
我的目标是使用这个指令来显示一个弹出窗口，该窗口只有一个文本输入和提交按钮。
单击该按钮将触发一个ajax帖子，该文章将提交文本输入值。
我感到困惑的是，我如何定义和在何处定义绑定输入的模型和执行输入的函数。
我知道我可以在主控制器上创建函数和属性，并将它们传递给作用域变量，但这对我来说没有意义，因为函数是孤立于指令的.
我也不认为我应该将这些添加到链接函数中的范围变量中，因为我不想操作控制器作用域，因为这似乎是个坏主意。
但是我没有看到任何机制来放置我的指令模型和函数，所以我应该使用不同的工具吗？我想要这个指令，这样我就可以将它声
浏览 5提问于2015-10-16得票数 0
2回答
我对一个定制的角度指令有问题。基本上，在下面的示例中，变量"name“如果超出了指令的作用域，就会正确地呈现，但在指令中时则不会。
模板：
<div ng-controller="swygController">
<div swyg="example" edit="load(id)">
{{name}}
</div>
{{name}
</div>
指令：
swyg.directive('swyg', function(){
return {
r
浏览 2提问于2013-10-26得票数 0
回答已采纳
我想知道如何获得给定父作用域的所有子作用域的列表。从作用域的属性中我能找到的只有$$childHead、$$childTail、$$nextSibling和$$prevSibling。
我现在使用的方法是从父对象获取childHead，然后使用nextSibling获取下一个子对象，直到nextSibling为空。
有没有更好的方法？假设我想在所有的子类上调用一个方法getModel，有没有更好的方法呢？
浏览 1提问于2012-09-29得票数 24
回答已采纳
1回答
我有一个指令嵌套在另一个指令中，如下所示。
我的问题是:如果父指令中的变量更改了值，那么如何自动更新子指令中的变量的值，该值是从父变量中计算出来的？
var myapp = angular.module('myApp',[]);
myapp.directive('parentDir', parentDir);
function parentDir() {
return {
restrict:'E',
controller: function eCtrl($scope) {
浏览 2提问于2014-06-26得票数 1
回答已采纳
我尝试将一个值从parent scope传递给我的directive。它的isolated scope。如果我将值作为参数传递给我的指令，它可以正常工作。但是id不适用于父作用域。
以下是我如何使用它：
<div ng-init="event='hello'"> <!-- this is parent scope -->
<input31></input31>
</div>
这是指令本身。
directives.directive("input31", [function(
浏览 7提问于2013-12-02得票数 1
如何使控制器函数对指令可见？是否将方法附加到作用域，并将作用域注入到指令中？首先，这是一个好主意吗？我想从UI中操作模型数据。
浏览 1提问于2014-04-11得票数 1
1回答
AngularJS:函数不是函数
、、、、
我有一个AngularJS应用程序，在其中一个页面上，我有许多小部件，每个小部件都显示一些关于系统一部分状态的信息。我目前正在努力添加该功能，以允许用户“隐藏”给定小部件的标题。
在显示小部件的页面上有一个“Settings”按钮，当单击该按钮时，它会在每个小部件的顶部覆盖一个工具栏。工具栏有许多按钮--其中一个是“设置”按钮，它打开一个对话框，允许用户更改该特定小部件的设置。
我在对话框中添加了一个复选框，使用户能够从视图中“隐藏”该特定部件的标题：
当在对话框上选中复选框，用户单击“预览”时，我希望(最终--我仍在努力实现该功能)隐藏该特定小部件的标题。但是，当前，当用户单击“预
浏览 3提问于2017-08-21得票数 0
我有一个带有输入框的标签，如下所示：
<label class="item item-input">
<input type="text" data-ng-model="description"
placeholder="Add a Description!">
</label>
如您所见，此输入框被绑定到范围"description“。
在我的控制器里，我有这样的东西：
$scope.description = "";
$scope.sub
浏览 3提问于2017-02-11得票数 1
回答已采纳
我有一个MainController和一个嵌套指令。我正在查看，以了解控制器和指令之间的通信是如何工作的，但我的通信似乎不起作用。
基本上，我想从自定义指令(按钮空手推车)调用主控制器作用域函数。参见下面的plunkr示例。
Plukr：
每当我执行console.log(范围.$apply(“emptyCart()”))时，由于某种原因它就没有定义。
注意:我尽量避免$rootScope.broadcast .
浏览 4提问于2014-06-03得票数 0
回答已采纳
我仔细阅读了关于这个主题的AngularJS文档，然后摆弄了一个指令。这是。
下面是一些相关的代码片段：
HTML{{text}}From 指令中的窗格：
作用域：{ biTitle：'='，标题：'@'，bar：'=‘}，
有几件事我不明白：
为什么我必须在'@'中使用"{{title}}"，在'='Can中使用"title"我也可以直接访问父作用域，而不用用attribute?The修饰我的元素文档说“通常希望通过表达式将数据从隔离作用域传递到父作用域”，但这似乎也适用于双向绑定。为什么
浏览 52提问于2012-12-27得票数 1095
回答已采纳
2回答
控制器访问指令范围值
、、、
我的html代码中有这个带有指令的控制器。该指令具有作用域值，我希望从父控制器访问并显示在html中。希望我的示例代码给您一个简单的概述，说明我正在努力实现的目标。
我知道使用$rootScope.showvalue = 'pass‘来完成这项工作；在指令中可以工作，但不知道这是否是最好的解决方案。
app.directive('customdir', [function() {
return {
restrict: "E",
scope: {
showvalue: "="
}
浏览 0提问于2016-08-12得票数 0
回答已采纳
在父控制器作用域中，我定义了selectedItem，它被设置为'x‘。然后在子作用域中，我使用ngModel定义了selectedItem：
<div ng-app>
<div ng-controller="CtrlA">
<div ng-controller="CtrlB">
<select ng-model="selectedItem" ng-options="item for item in items">
<
浏览 0提问于2013-01-09得票数 6
回答已采纳
我有一个angular.js指令来创建一个按钮(悬停类，左右图标，等等)。我通过scope: { uiButtonIconLeft: '@', uiButtonIconRight: '@' }自动绑定按钮的左右图标，以便将这些值绑定到父作用域的数据。然而，这会导致angularjs创建一个“隔离”作用域，这意味着在这种情况下使用我的指令不起作用：
<div ng-controller='someController'>
<a ng-repeat='thing in things'
ui-bu
浏览 7提问于2013-02-13得票数 3
回答已采纳
试图将我在AngularJS中的理解指令推向下一个层次。我读过这本书，取得了很大的进步，但这使我有点为难。我想我还缺少一些基本的关键理解。
比方说，我有两条指令。指令是并排的，而不是相互嵌套的。他们不以任何方式分享范围(据我所知)。这两个指令注入相同的服务。单击指令#1中的项时，单击处理程序调用服务上的一个函数，该函数将更改服务中的某些内容，而指令2应该对其做出反应。例如，假设我有一个"Logout“指令和一个"My”指令。单击“注销”后，我希望“我的帐户”指令变暗，或者让文本更改为“请登录”。"Logout“指令调用myService.logout()，"My
浏览 4提问于2014-01-16得票数 0
回答已采纳
通常在AngularJS的所有示例/源代码中，作用域的修改都是在控制器中完成的。在我的指令中，我需要从另一个指令(或它的作用域)中获取一些信息，并将其放入作用域(因此在指令的模板中可见)。由于此信息在此指令的所有实例中都是通用的，因此使用作用域绑定对我来说听起来并不好。
因此，我找到的唯一解决方案是在链接函数中修改实例作用域：
link: function(scope, element, attr, parentCtrl) {
scope.data = parentCtrl.someData;
}
这个解决方案是可行的。
问题:根据AngularJS的理念/风格修改
浏览 0提问于2012-12-26得票数 4
回答已采纳
我似乎找不到在不使用隔离作用域的情况下从指令中调用父作用域上的函数的方法。我知道如果我使用隔离作用域，我可以只在隔离中使用"&“来访问父作用域上的函数，但是在不必要的时候使用隔离作用域会产生后果。考虑以下HTML：
<button ng-hide="hideButton()" confirm="Are you sure?" confirm-action="doIt()">Do It</button>
在这个简单的例子中，我想要显示一个JavaScript确认对话框，并且只有在确认对话框中单击"OK“
浏览 37提问于2013-07-11得票数 95
回答已采纳
我希望在我的指令中访问来自父=>父控制器的函数(用控制器作为表示法)。我使用的是角1.3.14，我有以下结构：
控制器(带有保存功能)
(子)控制器
带有模板(和独立作用域)的指令。在这个模板中，我有一个按钮，它应该从父(父)控制器调用保存函数。
我不想打电话给$scope.$parent.$parent.save(.)有人有主意吗？
提前谢谢。
浏览 5提问于2015-04-29得票数 0
回答已采纳
我需要在指令中继承父控制器的作用域。我不一定想离开scope: false。我也不一定想要使用一个孤立的作用域，因为它需要大量的工作来正确地链接我所关心的值(考虑在父控制器中有很多值)。
如果我想更新父作用域，在我的指令中使用scope:true有意义吗？
<div ng-controller="MyCtrl">
Hello, {{name}}!
<my-directive></my-directive>
</div>
var myApp = angular.module('myApp'
浏览 2提问于2013-05-31得票数 33
回答已采纳
1回答
我有一个指令，它的模板是一个<img>元素，我想执行一个自定义方法，该方法在我的指令范围内：
<my-directive>
<!-- my directives template -->
<p>...</p>
<img onload="myScopeMethod()">
<p>...</p>
<!-- my directives template -->
</my-directive>
我找到了这个，但是只有当我将它应用
浏览 4提问于2015-01-16得票数 1
回答已采纳
2回答
在指令中创建可以让我们将外部作用域映射到内部作用域。我们已经看到了六种不同的映射到attrbutes的方法：
=attr&attr@attr= &@
这些作用域映射选项都有什么作用？
浏览 29提问于2014-02-12得票数 111
回答已采纳
如何使用表达式绑定通过两个具有独立作用域的指令传递函数？
在父子关系中，我有两个指令：
app.directive('parentDir', function(){
return {
scope:{
parentData:'=',
changeRouteParent:'&'
},
templateUrl:'mydir/parentTemplate.html'
};
});
app.directive('
浏览 1提问于2014-02-14得票数 2
我有以下三个简单的三层标记，每个层都是自己的指令。
<div class="schedule">
<div class="shift" ng-repeat="shift in schedule.shifts">
<div class="task" ng-repeat="task in shift.tasks">
虽然我没有在上面的标记中显示它，但我希望每个层都是一个独立的作用域(因此shifts将被隔离，tasks也在shifts中被隔离)。
我在sche
浏览 1提问于2014-08-13得票数 0
回答已采纳
我正在为jqueryui draggable写一个指令，但是在拖动之后，我遇到了一些问题，让左边和顶部的位置绑定到我的作用域。有人能给我指个方向吗？
myApp.directive('draggable', function () {
return {
restrict: 'A',
link: function (scope, element, attrs) {
element.draggable({
cursor: "move",
stop: function (e
浏览 0提问于2013-01-08得票数 7
回答已采纳
看到
<body ng-controller="MainCtrl">
{{ obj }}
<dir>
<input type="text" ng-model="obj" />
</dir>
</body>
为什么当我用obj修改自定义指令中的ng-transclude作用域变量时，没有在MainCtrl $scope.obj中更改它。
但是，当我在$scope.obj = { name : 'test' };中使用MainCt
浏览 1提问于2015-02-13得票数 0
回答已采纳
我已经创建了一个简单的“模式对话”指令，它使用transclude。我想在"modal“指令中放置一个form ()。我希望放在指令中的表单的formController在父控制器的作用域中是可以访问的，但它不是。
完整代码：
<!DOCTYPE html>
<html>
<head>
<title>AngJS test</title>
<link rel="stylesheet" type="text/css" href="//cdn.js
浏览 2提问于2013-04-11得票数 20
回答已采纳
1回答
我正在使用controller as语法，并且不确定如何访问子指令的作用域。我可以这样做，但必须有更好的方法，不是吗？
angular.module('saProducts').directive 'saProductNew', ->
restrict: 'A'
templateUrl: 'app/products/templates/new.html'
controllerAs: 'product'
controller: ($scope, Product) ->
@save
浏览 1提问于2015-03-04得票数 0
回答已采纳
嗨，哪个更好？有什么关系？优点和缺点是什么？
以下是两者的比较代码：
作用域：{ ngModel:'=‘}
<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>
<div ng-app="app">
<input ng-model="code"></my-di
浏览 1提问于2016-06-03得票数 5
回答已采纳
3回答
我设置了一个带有标题和apply/cancel按钮的通用对话框指令。该对话框有一个独立的作用域。
对话框指令的内容被屏蔽，因此它的作用域是对话框作用域的同级：
从角度上的js文档：
然而，孤立作用域会产生一个新的问题:如果一个已被屏蔽的DOM是小部件隔离作用域的一个子级，那么它将无法绑定到任何东西。因此，在小部件为其局部变量创建独立作用域之前，排除作用域是原始作用域的子作用域。这使得被屏蔽的和小部件隔离的作用域兄弟姐妹。
这给我带来了一个新的问题。被屏蔽的DOM应该能够在应用对话框时响应它。为此，我想在对话框上设置一个“应用”属性，并让被屏蔽的DOM监视它。但这是不可能的，因为他们是兄
浏览 1提问于2013-01-19得票数 7
回答已采纳
我正在尝试创建一个AngularJS指令来处理一个模态窗口，但是我不知道如何隔离这个作用域。我的目标是有一个模式窗口，以添加一个新的位置。我希望指令用父作用域所需的任何数据填充该模式，并处理保存按钮单击。我使用父作用域实现了这个功能，但是我一直无法让它与孤立的作用域一起工作。
父控制器具有locations属性，在这种情况下，它是我需要的唯一父属性。应该将newLocation对象与父范围隔离开来。当我添加隔离作用域时，名称输入不会被填充，单击处理程序也不会触发。范围声明只允许@、=和& properties，因此我不能在那里进行扩展，并且在链接中添加属性没有任何效果。
指令：
浏览 3提问于2015-10-18得票数 1
回答已采纳
我有一个重复的指令，它继承了它的父控制器的作用域。
<div ng-controller="myController">
{{ message }}
<person ng-repeat="person in persons"></person>
</div>
app.controller('myController', function ($scope) {
$scope.message = "A";
$scope.pe
浏览 2提问于2014-10-27得票数 1
回答已采纳
我正在尝试用anugularJS生成一个n级分层无序列表，并且已经成功做到了这一点。但是现在，我在指令和控制器之间遇到了作用域问题。我需要在指令模板中名为via ng-click的函数中更改父对象的作用域属性。
请参阅 -这是JS
var app = angular.module('myApp', []);
//myApp.directive('myDirective', function() {});
//myApp.factory('myService', function() {});
function MyCtrl($scope) {
浏览 0提问于2013-03-13得票数 18
回答已采纳
我正在学习AngularJS指令，我想做的一件事是在父scope (controller的scope )中传递一些变量$scope.message，并希望在directive alert中将其重命名为param。我可以用一个独立的作用域来做到这一点：
<div alert param="message"></div>
并定义
.directive("alert", function(){
return{
restrict: "A",
scope: {
para
浏览 0提问于2014-12-31得票数 14
回答已采纳
5回答
我有两个控制器，一个包装在另一个中。现在我知道子作用域继承了父作用域的属性，但是有没有办法更新父作用域变量呢？到目前为止，我还没有发现任何明显的解决方案。
在我的情况下，我在一个表单中有一个日历控制器。我想从父作用域(即表单)更新开始和结束日期，以便表单在提交时具有开始和结束日期。
浏览 2提问于2013-06-05得票数 113
回答已采纳
我正在学习angular，我来自jQuery背景，面临着抓住angular的难题。因此，我经常在理解angular代码中的许多东西时遇到困难。
刚刚看了下面的代码，我不明白下面的指令中的作用域是做什么的？
但是如果我从下面的指令中删除作用域，那么什么将不起作用？所以如果可能的话，请用一个例子帮助我理解作用域的用法和它的重要性。谢谢
<li my-directive price="item.price" ng-repeat="item in products">{{item.name}} — {{item.price}}</l
浏览 1提问于2016-04-10得票数 2
我正试图找出如何正确地使用嵌套指令和转接和^require的角度。我希望有一个outter指令，它有一个由嵌套的子指令更新的变量，但是我希望所有的子指令都被链接到这个变量。我写了一个非常简单的例子来演示这个问题。
JS
(function () {
'use strict';
angular
.module('app')
.directive('test', test);
function test() {
var directive = {
bi
浏览 1提问于2016-04-08得票数 0
我想我对如何正确构建自定义指令感到困惑--即何时在指令中使用控制器。如果他们使用一个独立的作用域，并且拥有从他们的父控制器传递给他们的属性，这是很好的。
但是，正如我认为指令应该被视为可重用组件一样，有自己的控制器来设置助手方法、作用域变量等是有意义的，就像在常规控制器中一样。例如，我有一个自定义指令，在它的模板中我使用ng-show。该条件使用我在指令的控制器中编写的方法检查范围属性。
<div>
<div ng-show="isLong()"></div>
</div>
在指令中，我在控制器中设置了isLong：
an
浏览 3提问于2014-06-19得票数 0
1回答
我正在尝试生成如下的属性名称：
name="id{{myScopeId}}"
这在大多数情况下都能很好地工作，但是当我在一个已经有自定义指令的元素上这样做时，它就不再起作用了，结果只有"id“。
此自定义指令应用于文件输入元素，并处理文件名。
这将会起作用，结果是
name="file5" : <input name="file{{myId}}" type="file" />
这不会起作用，结果是
name="file" : <input name="file{{myId}}&
浏览 0提问于2013-05-11得票数 0
回答已采纳
1回答
请参考。问题:当我在主控制器中使用item-over指令时，它会触发fine OnOver。这样可以正常工作：
<a href="#" ng-repeat="item in main.Data" item-over="main.OnOver(item)">{{item.Name}}</a>
但是当我把它放在list-view指令中时，它不会触发控制器的OnOver方法。这不起作用：
<list-view itemssource="main.Data">
<a href="
浏览 19提问于2017-12-30得票数 0
回答已采纳
我的html视图如下
School.html
<html>
<body>
<div class="col-xs-9">
<!-- major bootstrap html code goes over here -->
</div>
<div class="col-xs-3">
<!--Call to directive goes here-->
<div student-profile ngInit="stu
浏览 4提问于2016-03-09得票数 0
2回答
在angularjs指令的指南教程中，指令对象可以具有作用域属性。它定义了指令的范围。
虽然作用域atribute值可能为真，但以下是对作用域的解释：( )
true:将为指令的元素创建一个原型继承自其父元素的新子范围。如果同一元素上的多个指令请求一个新作用域，则只创建一个新作用域.
我对那些粗犷的句子感到困惑。如何在同一元素上使用多个指令并使用相同的作用域？
浏览 2提问于2017-05-05得票数 0
2回答
当范围未在角指令定义中设置时，范围属性是如何继承的？
在中(在“指令定义对象”下)有两种情况:当scope是true或scope是对象({})时。如果范围没有设置或者是假的，该怎么办。在本例中，对于范围和它的子域，属性是如何继承的？
浏览 0提问于2013-10-13得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
