在模板中访问一个元素与$ location.path过渡后， [英] Access an element in a template after a transition with $location.path

问题描述

在属于某一路线欲点击，在范围调用一个方法，并从那里我将过渡到一个新的途径，并寻找一个元素在模板上为新路线的链接或按钮的模板。基本上是这样的：

On a template that belong to a certain route I want to click on a link or button that calls a method in the scope and from there I will transition to a new route and look for an element on the template for the new route. Basically something like this:

    app.controller('SomeController', function SomeController($scope, $location) {
        $scope.goToOverview = function (showModal) {
            $location.path("overview/basic");

            if(showModal){
               $('#basicModal').modal('toggle');
            }
        };
    });

问题是，当我到达jQuery选择，对于概述/基本路线模板尚未加载因此该元素是找不到的。

The problem is that when I reach the jQuery selector, the template for the "overview/basic" route has not been loaded yet so the element is not found.

这又如何解决呢？

感谢您。

推荐答案

作为<一个href=\"https://stackoverflow.com/questions/22848673/access-an-element-in-a-template-after-a-transition-with-location-path?noredirect=1#comment34856684_22848673\">requested, 此处是从一个控制器广播一个事件，并在另一个控制器捕捉它的一个例子：

As requested, here is an example of broadcasting an event from one controller and catching it in another controller:

<div ng-app="MyApp">
    <div ng-controller="OneCtrl">
        <form>
            <input type="text" ng-model="msg"></input>
            <input type="submit" ng-click="send(msg)" value="Broadcast"></input>
        </form>
    </div>
    <div ng-controller="TwoCtrl">
        <p>Message from OneCtrl: {{ msg }}</p>
    </div>
</div>

<script type="text/javascript">
var app = angular.module("MyApp", []);

app.controller('OneCtrl', function ($scope, $rootScope) {
    $scope.send = function (msg) {
        $rootScope.$broadcast('one_msg', {
            msg: msg
        });
    };
});

app.controller('TwoCtrl', function ($scope) {
    $scope.$on('one_msg', function (event, data) {
        $scope.msg = data.msg;
    });
});
</script>

这篇关于在模板中访问一个元素与$ location.path过渡后，的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！