控制器的外部访问NG-模型数据 [英] Access ng-model data outside of the controller

查看:125
本文介绍了控制器的外部访问NG-模型数据的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我已经写了下面code

I have written the below code

<span ng-controller="calanderCtrl">
<input type="text" ng-model="onDate">
</span>  
<pre>user.name = <span ng-bind="onDate"></span></pre>

我知道它的NG-控制器之外,所以我不能够绑定数据,但我的应用程序需要calanderCtrl控制器。我想这个价值投入的范围,这样我可以使用它的其他控制器内部也。我该怎么做呢?

I know its outside of the ng-controller so i am not able to bind the data, but my application requires calanderCtrl controller. I want to put this value to scope so that i can use it inside other controllers also. How do i do this?

推荐答案

您可以使用此一发布订阅模式。这样,你避免将变量的rootscope。

You could use a publish subscribe pattern for this. That way you avoid putting the variable on the rootscope.

function Ctrl($scope) {
    $scope.onDate = "12/01/2015";

    $scope.$watch('onDate', function(newValue, oldValue) {
     $scope.$emit('onDateChanged', newValue);
    });
 }

function Ctrl2($scope, $rootScope) {
   $scope.onDate = "";

   $rootScope.$on('onDateChanged', function(event, value) {
   $scope.onDate = value;
   });
}

您控制器将被调用时,你的模板负载。

Your controller will get called when your template loads.

<span ng-controller="Ctrl">
<input type="text" ng-model="onDate">
</span>  
<pre>user.name = <span ng-controller="Ctrl2" ng-bind="onDate"></span></pre>

现在它是如何工作的:

角不共享范围。每个控制器都有自己独立的范围。
所以,为了让我们的子作用域到,我们需要对我们至极孩子的订阅不知何故引发事件的日期。这可以通过两种方式来完成。

Angular does not share scopes. Each controller has its own seperate scope. So in order to keep our child scopes up to date we need to somehow throw an event on wich our childs subscribe. This can be done in two ways.

$范围。$发出 $ rootScope。$广播

两者之间的差异是微妙的。

The difference between the two is subtle.

$范围。$放出西港岛线发送事件链向上。因此,例如考虑这个范围层次。

$scope.$emit wil send the event up the chain. so for instance consider this scope hierarchy.

rootscope
    scope1 ---> subscribes to the emit $scope.$on
      scope2 ---> performs a $scope.$emit
        scope3 ---> subscribes to the emit $scope.$on

只有scope1将捕获的事件。因为$范围。$排放上升的链条。
这是一种方法,只更新特定范围。 altough是什么做的大多是这样的。

only scope1 will catch the event. since $scope.$emit goes up the chain. this is a way to only update specific scopes. altough what is mostly done is this.

rootscope
        scope1 ---> subscribes to the emit $rootScope.$on
          scope2 ---> performs a $scope.$emit
            scope3 ---> subscribes to the emit $rootScope.$on

我们scope1和scope3的控制器注入$ rootScope和订阅的rootscope的发光。由于rootscope是最高的范围,它会永远抓住$从scope2发出。这是一种特定的控制器至极订阅的rootscope只发送该事件。

we inject $rootScope in the controller of scope1 and scope3 and subscribe to the emit on the rootscope. Since the rootscope is the highest scope it will always catch the $emit from scope2. This is a way to only send the event to specific controllers wich subscribe on the rootscope.

最后,我们也可以这样做:

lastly we can also do this:

 rootscope
            scope1 ---> subscribes to the emit $scope.$on
              scope2 ---> performs a $rootScope.$broadcast
                scope3 ---> subscribes to the emit $scope.$on

我们现在喊的rootscope和,而不是像EMIT动了起来,广播作品环比下跌。这是在一个房间里,大家谁不有他的耳朵保护会听到呼喊它的等价物。在本质上大家谁在本地范围内订阅的广播发送事件

we are now shouting on the rootscope and instead of moving up like emit, broadcast works down the chain. This is the equivalent of shouting in a room and everyone who doesnt have his ear protectors on will hear it. in essence everyone who subscribes on their local scope to the event that broadcast is sending

这篇关于控制器的外部访问NG-模型数据的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆