从子控制器调用父控制器功能

从子控制器调用父控制器功能

关注
发信
关注(28)粉丝(399)

Angular ui.router，从子控制器调用父控制器功能?

本文介绍了Angular ui.router，从子控制器调用父控制器功能?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

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

解决方案

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

JS

角度.module("myApp", []).controller("parent", function($scope) {$scope.parentFunction = function() {alert("在父级上调用了一个函数")};}).controller("child", function($scope) {$scope.childFunction = function() {alert("在孩子身上调用了一个函数")};$scope.parentFromChild = function() {alert("我知道这感觉很奇怪");$scope.parentFunction();};})

HTML

<头><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><body ng-app="myApp"><div ng-controller="parent"><div ng-controller="child"><a href="#" ng-click="parentFunction()">调用父级</a><a href="#" ng-click="childFunction()">Call Child</a><a href="#" ng-click="parentFromChild()">从孩子调用父级</a>

</html>

控制器上的作用域是原型继承的我相信这意味着如果你不在作用域上重新定义一个函数，如果你调用它，你会从父作用域获得相同的函数(问题是这样就假设了上下文尽管假设您不依赖该控制器中该控制器的某些效果，这是否真的是一个问题，但这是有争议的).

I'm using Angular with ui.router and have setup a nested view. The parent view has a div whose visibility I can toggle through a function on the parent controller. I'd like to call this function from the child controller of the nested view. How would I do this?

解决方案

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>

The scope on controllers is prototypically inherited I believe which means if you don't redefine a function on the scope you get the same function from the parent scope if you call it (the problem is this then makes the assumption about the context of the use of this controller though it's debatable if this is really an issue assuming you don't depend on some effect from that controller in this controller).

这篇关于Angular ui.router，从子控制器调用父控制器功能?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！

08-05 15:18
Powered by LMLPHP ©2024 从子控制器调用父控制器功能 0.045238