Angular ui.router,从子控制器调用父控制器函数?

2024-05-19

我将 Angular 与 ui.router 一起使用,并设置了嵌套视图。父视图有一个 div,我可以通过父控制器上的函数切换其可见性。我想从嵌套视图的子控制器调用此函数。我该怎么做?


http://plnkr.co/edit/zw5WJVhr7OKqACoJhDZw?p=preview http://plnkr.co/edit/zw5WJVhr7OKqACoJhDZw?p=preview

JS

angular
    .module("myApp", [])

    .controller("parent", function($scope) {
        $scope.parentFunction = function() {
            alert("Called a function on the parent")
        };
    })

    .controller("child", function($scope) {
        $scope.childFunction = function() {
            alert("Called a function on the child")
        };

        $scope.parentFromChild = function() {
            alert("I know this feels weird");
            $scope.parentFunction();
        };
    })

HTML

<!DOCTYPE html>
<html>

  <head>
    <script data-require="angular.js@*" data-semver="1.2.14" src="http://code.angularjs.org/1.2.14/angular.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body ng-app="myApp">
    <div ng-controller="parent">
      <div ng-controller="child">
        <a href="#" ng-click="parentFunction()">Call Parent</a>
        <a href="#" ng-click="childFunction()">Call Child</a>
        <a href="#" ng-click="parentFromChild()">Call Parent from Child</a>
      </div>
    </div>
  </body>

</html>

我相信控制器上的作用域是原型继承的,这意味着如果您不在作用域上重新定义函数,那么如果您调用它,您会从父作用域中获得相同的函数(问题是这会做出有关使用上下文的假设尽管假设您不依赖于该控制器中该控制器的某些效果,但这是否确实是一个问题是有争议的)。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Angular ui.router,从子控制器调用父控制器函数? 的相关文章

  • AngularJS,使用没有后退按钮刷新的路由

    我在用着angularJS使用 AJAX 构建一个简单的单页应用程序 但是当用户使用本机后退按钮时我遇到了问题 angular module myApp ionic myApp controllers myApp services conf
  • 在 AngularJS 中将数组绑定到指令变量

    我正在尝试将数组放入模板中 以便我可以使用其中的各个值 我的问题是 该属性一旦进入我的模板就会变成字符串 因此它不再可以作为 var 0 访问 而是返回 字符串 的第一个字符 通常是 这是数据的简化设置 varForward 100 1 v
  • 如何创建自定义输入类型?

    例如 我想创建一个类似于 AngularJS 实现 电子邮件 的方式的自定义输入类型
  • 添加甜蜜警报 Angular js

    我是 AngularJS 的新手 我正在尝试使用来自https github com oitozero ngSweetAlert https github com oitozero ngSweetAlert 我已经将相应的脚本添加到我的in
  • 如何使用 $http.get 获取 304 状态代码?

    如何使用 http get 获取 304 状态代码 http get menu json success function data status headers scope menu data console log status sho
  • 使用最新的不稳定分支生成 Angularjs 应用程序?

    刚开始使用 Yeoman 并喜欢它 但是 我正在构建一个依赖于一些 Angular 1 1 x 功能的应用程序 ng trim and ng animate 并且 Angular generator 使用最新的稳定分支作为默认分支 但不包含
  • 为什么在这个函数定义中像这样使用“window.angular”?

    我正在尝试理解一个我需要用来与 Django 集成的 angularjs 文件 它有一个我不熟悉的奇怪语法 请记住我是一名初级开发人员 所以这可能是你的面包和黄油 它是这样的 function angular undefined use s
  • 选择器的内部文本

    我尝试从此标记中获取内部文本 span class ng binding ng scope Displaying results 1 25 of 17 430 span 使用此选择器 document querySelectorAll di
  • Angularjs 模式的复选框表现得很奇怪

    我有一个有角度的应用程序plunker http plnkr co edit rac8w9g8L0eX8mlXKuVn p preview 当我们单击该按钮时 它会打开一个包含项目列表的模式对话框 其中 2 项是根据复选框表输入中的条件进行
  • 如何在angularjs中使用addClass方法

    我有一个仅限于类的 angularjs 指令 如何使用 angularjs 中的 addClass 方法添加它 指示 app directive number function return restrict C link function
  • 在角度控制器中监听文档事件

    如何捕获角度控制器中的事件 我有文档级事件 所以我需要在角度控制器中捕获事件 这可能吗 Update 我有独立的 js 文件来处理来自相机的一些操作 document addEventListener myCameraEvent handl
  • 如何使用降级 Module() 引导应用程序与 ui-router 混合

    我正在使用 ui router 混合 https github com ui router angular hybrid https github com ui router angular hybrid 引导 经典 方式 我们在数据网格中
  • 如何正确清理来自 AngularJS 控制器的无效输入的表单?

    我有一个 AngularJS 表单 其中包含 除其他字段之外 类型之一url 后者很重要 因为这会强制相应的输入成为有效的 URL 在某些条件下 例如 要关闭具有此类表单的模式对话框 我想以编程方式清除该表单 为此 我实现了方法reset基
  • 如何清除单个函数中的所有 AngularJS $scope 和 $rootScope 值?

    我需要清除所有 scope执行某些操作时的值 例如 如果我点击 Signout 按钮重定向到 signin 页面 然后所有 scope or rootScope应清除会话中的值 我怎样才能实现这个目标 您可以执行以下操作 rootScope
  • 传递给 $resource 的 @id 是什么?

    resource entries id id id update method PUT id是什么 在 资源上doc page http docs angularjs org api ngResource 24resource下面有人这么说
  • 用户脚本 - 有没有办法将 jquery 代码注入 angularjs dom?

    所以我正在尝试为一个网站创建用户脚本 我无法更改网站的任何源代码 因为它不是我的 网站到处都使用 AngularJS 控制器 我研究了几天如何做到这一点 但没有成功 所以我尝试注入代码 nav after div test div 当我通过
  • 使用 JS 在 Angular 中创建删除按钮的确认警报

    我有一个带有删除按钮的表单 我想创建一个单击删除按钮时弹出的确认框 删除按钮当前有效 我在 javascript 中尝试了一些方法 但没有成功 我正在使用角度 这是最好的方法吗 另外 有谁知道这方面的任何例子 我还没有找到任何有效的例子 d
  • 如何在 angular-ui 中动态禁用 ui-sortable 指令

    我正在使用 Angular ui 使用 ui sortable 指令进行排序 是否可以根据范围状态动态启用 禁用可排序功能 因此 我需要一个按钮来更改范围属性的状态 并且根据此属性可排序是否应该工作 角度指令支持观察可排序选项何时发生变化
  • 使用 Jasmine 测试服务功能 POST 响应

    我不完全确定如何执行此操作 但我有一个端点 URL 它是用于登录身份验证的 POST 请求 添加请求负载时 您将获得成功的登录凭据或错误 但是 我似乎在获取响应时遇到问题 这是我的spec file describe Service Aut
  • 禁用在 django Rest Framework 中创建嵌套对象

    Hi 你能帮我怎么做吗禁用创建嵌套对象 我有这样的序列化器 员工拥有团队的外键 class TeamSerializer serializers ModelSerializer class Meta model Team fields id

随机推荐