角1.3重大更改 - 范围设置，但之前重新申请$ [英] Angular 1.3 breaking changes - scope set but reset before $apply

问题描述

AngularJs 1.3.x中，简单的控制器工作，但只要我使用打字稿及注塑重新写它，它失败。如果我引用的1.2.x它开始工作了。

  //这在1.3.x的
scopeApp.controller（'myController的'，['$范围'，函数（$范围）{
    $ scope.username ='世界';
    $ scope.sayHello =功能（）{
        $ scope.greeting ='你好'+ $ scope.username +！;
    };
}]）;
 

http://plnkr.co/edit/ssSuuZuGlrypemx3BU5r?p=$p$ PVIEW

  //这不会在1.3.x的作品，但确实在1.2.x版本
//下面的code是通过打字稿产生：
VAR MainFeature;
（函数（MainFeature）{
    VAR MainCtrl =（函数（）{
        功能MainCtrl（$范围）{
            this.scope = $范围;
            this.name =Sirar;
            this.message ='';
        }
        MainCtrl.prototype.SetMessage =功能（）{
            this.message ='你好'+ this.name;
        };
        返回MainCtrl;
    }）（）;
    MainFeature.MainCtrl = MainCtrl;
}）（MainFeature ||（MainFeature = {}））;scopeApp.controller（MainCtrl，[$范围功能（$范围）{
  返回新MainFeature.MainCtrl（$范围内）;
}]）;
 

重大更改有有价值的信息，但没有帮助文档：

1. https://docs.angularjs.org/guide/migration


2. http://ng-learn.org/2014/06/Migration_Guide_from_1 -2_to1-3 /


3. 的http://wildermuth.com/2014/11/11/Angular_1_3_and_Breaking_Change_for_Controllers

解决方案

您需要通过构造函数，而不是一些其他的功能，像你这样。正如我在<一个解释href=\"http://stackoverflow.com/questions/27880375/controllers-are-created-using-a-factory-function/27881657#27881657\">another答案控制器没有通过调用新创建。它创建如下：

 实例=的Object.create（controllerPrototype）;
...
返回fn.apply（个体经营，参数）;
 

美中不足的是，返回值是不使用，但实例。你的情况，这将意味着：

 实例=的Object.create（{}）; //应该是MainCtrl.prototype
...
返回fn.apply（个体经营，参数）;
 

所以，MainCtrl最终为空的对象。你必须做你应该首先做了，通过构造函数：

  scopeApp.controller（MainCtrl，[$范围，MainFeature.MainCtrl]）;
 

AngularJs 1.3.x, simple controller works but as soon as I re-write it using Typescript and Injection, it fails. If I reference 1.2.x it starts working again.

//This works in 1.3.x
scopeApp.controller('MyController', ['$scope', function ($scope) {
    $scope.username = 'World';
    $scope.sayHello = function () {
        $scope.greeting = 'Hello ' + $scope.username + '!';
    };
}]);

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

//This DOES NOT works in 1.3.x but does in 1.2.x
//The following code is produced via Typescript:
var MainFeature;
(function (MainFeature) {
    var MainCtrl = (function () {
        function MainCtrl($scope) {
            this.scope = $scope;
            this.name = "Sirar";
            this.message = '';
        }
        MainCtrl.prototype.SetMessage = function () {
            this.message = 'Hello' + this.name;
        };
        return MainCtrl;
    })();
    MainFeature.MainCtrl = MainCtrl;
})(MainFeature || (MainFeature = {}));

scopeApp.controller("MainCtrl", ["$scope", function ($scope) {
  return new MainFeature.MainCtrl($scope);
}]);

Breaking changes docs that have valuable information but didn't help:

1. https://docs.angularjs.org/guide/migration
2. http://ng-learn.org/2014/06/Migration_Guide_from_1-2_to1-3/
3. http://wildermuth.com/2014/11/11/Angular_1_3_and_Breaking_Change_for_Controllers

解决方案

You need to pass the constructor function, not some other function like you did. As I explained in another answer the controller is not created by calling new. It's created as follows:

instance = Object.create(controllerPrototype);
...
return fn.apply(self, args);

The catch is that the return value is not used, but the instance. In your case this would mean:

instance = Object.create({}); // should be MainCtrl.prototype
...
return fn.apply(self, args);

So "MainCtrl" ends up as empty object. You have to do what you should have done in the first place, pass the constructor:

scopeApp.controller("MainCtrl", ["$scope", MainFeature.MainCtrl]);

这篇关于角1.3重大更改 - 范围设置，但之前重新申请$的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！