Angular.js＆QUOT;控制器...＆QUOT; + $范围。在$ [英] Angular.js "Controller as ..." + $scope.$on

问题描述

如果我想使用控制器为...语法角度，应该怎么上（...）做事像$范围。$，我需要把控制器内？

我得到一个IM pression我可以做得比下面显示的其他方式。
在这里，拿到$范围。$上工作我绑定本给回调函数。我试图调用$上这个控制器内，但没有奏效。

你能不能给我一个提示，或在这里如果我完全搞乱了，你可以指出我做一些正确的方式？谢谢你。

main.js

  angular.module（'ramaApp'）
.controller（'MainCtrl'，['$范围，$位置'，函数（$范围，$位置）{    this.whereAmINow =索引;    $范围。在（'$ locationChangeStart'，函数（事件）{$        this.whereAmINow = $ location.path（）;    } .bind（本））;    this.jumpTo =功能（在哪里）{$ location.path（其中）; }
}]）;
 

index.html的：

 ＆LT; D​​IV NG控制器=MainCtrl为主＆GT;    ＆LT; P＆GT;我看到一个名为幻灯片：{{main.whereAmINow}}＆LT; / P＆GT;    ＆LT; D​​IV NG点击=main.jumpTo（'/滑件1'）＆GT;幻灯1 LT; / DIV＆GT;
    ＆LT; D​​IV NG点击=main.jumpTo（'/滑件'）＆GT;幻灯片2'; / DIV＆GT;
    ＆LT; D​​IV NG点击=main.jumpTo（'/ slide3'）＆GT;幻灯片3'; / DIV＆GT;＆LT; / DIV＆GT;
 

解决方案

据我所知，你需要，如果你想$范围观察家/方法注入$范围。 ControllerAs只​​是语法糖，以便更清楚地看到你的嵌套控制器的结构。

三个想法，虽然这可能简化您的code。

1. 使用VAR VM =这一点，为了摆脱绑定的（这一点）。

     VAR VM =这一点;
   vm.whereAmINow =/;$范围。在（'$ locationChangeStart'，函数（事件）{$
       vm.whereAmINow = $ location.path（）;
   }）;vm.jumpTo =功能（在哪里）{
       $ location.path（其中）;
   }
    




2. 整个whereamINow变量有意义付诸应用程序的初始化又名.RUN（）（前的配置），因为我认为这是一个全局变量，你并不需要使用一个$范围观察者/法吧。




3. 另一种选择是使用工厂进行更改持续存在，所以你只需创建一个位置工厂，保存当前活动路径。

If i'd like to use the "Controller as ..." syntax in Angular, how should I approach things like $scope.$on(...) that i need to put inside the controller?

I get an impression i could do it some other way than the one shown below. Here, to get $scope.$on working i bind "this" to the callback function. I tried to invoke $on on "this" inside the controller but it didn't work.

Could you give me a hint here or if i'm completely messing up, could you point me to some right way to do it? Thanks.

main.js:

angular.module('ramaApp')
.controller('MainCtrl', ['$scope', '$location', function ($scope, $location) {

    this.whereAmINow = 'INDEX';

    $scope.$on('$locationChangeStart', function(event) {

        this.whereAmINow = $location.path();

    }.bind(this));

    this.jumpTo = function(where) { $location.path(where); }
}]);

index.html:

<div ng-controller="MainCtrl as main">

    <p>I am seeing the slide named: {{ main.whereAmINow }}</p>

    <div ng-click="main.jumpTo('/slide1')">Slide 1</div>
    <div ng-click="main.jumpTo('/slide2')">Slide 2</div>
    <div ng-click="main.jumpTo('/slide3')">Slide 3</div>

</div>

解决方案

As far as I know, you need to inject $scope if you want $scope watchers/methods. ControllerAs is just syntactic sugar to enable to see more clearly the structure of your nested controllers.

Three ideas though which may simplify your code.

1. Use var vm = this, in order to get rid of the bind(this).

   var vm = this;
   vm.whereAmINow = "/";
   
   $scope.$on('$locationChangeStart', function(event) {
       vm.whereAmINow = $location.path();
   });
   
   vm.jumpTo = function(where) {
       $location.path(where);
   }
   

2. The whole whereamINow variable makes sense putting it into the initialization of app aka .run() (before config) since I assume it's a global variable and you don't need to use a $scope watcher/method for it.

3. Another option is to use a factory to make the changes persist, so you simply create a location factory which holds the current active path.

这篇关于Angular.js＆QUOT;控制器...＆QUOT; + $范围。在$的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！