web-dev-qa-db-ja.com

AngularJS HotTowelのvm "ControllerAs"構文を使用しているときにユニットテストファイルから$ scopeにアクセスする

例はこちらをご覧ください: http://www.johnpapa.net/angularjss-controller-as-and-the-vm-variable/

タイトルが示すように、私はこのチュートリアル[ http://tech.pro/tutorial/1473/getting-started-with-angularjs-unit-testing] に従ってユニットテストをセットアップし、すべてが事実を除いて問題ありませんVM変数にアクセスできないようですas my $ scope

dashboard.js

var controllerId = 'dashboard';
angular.module('app')
    .controller(controllerId, ['common', 'datacontext', dashboard]);


function dashboard(common, datacontext) {
    var getLogFn = common.logger.getLogFn;
    var log = getLogFn(controllerId);

    var vm = this;      
    vm.title = 'Dashboard';

dashboard.Spec.js

describe("app module", function() {
    beforeEach(module("app"));

    describe("dashboard", function() {
        var scope,
            controller;

        beforeEach(inject(function($rootScope, $controller) {
            scope = $rootScope.$new();
            controller = $controller;
        }));

        it("should assign Dashboard as title", function() {
            controller("dashboard", {
                $scope: scope
            });
            expect(scope.title).toBe("Dashboard");
        });
    });
});

私が試したこと:コントローラーの依存関係で直接 '$ scope'に名前を付け、 "title"プロパティをそれに設定すると機能します(テストに合格します)。ただし、パターンはそのままにしておきたい。

また、依存関係に直接$ scopeを渡して、コントローラーパラメーターに "vm"という名前を付けてみました...

Karmas失敗テストメッセージは次のとおりです:Undefined to undefined to 'Dashboard'

助けてくれてありがとう!

32
proggrock

ああ、明らかです...テストで作成されたコントローラーへの参照を作成することで、vm変数にアクセスできます。

 it("should assign Dashboard as title", function () {
       var vm = controller("dashboard", { $scope: scope });
       expect(vm.title).toBe("Dashboard");
    });
58
proggrock

これを行うこともできます:

it("should assign Dashboard as title", function () {
    var controller = controller("dashboard as vm", { $scope: scope });

    expect(scope.vm.title).toBe("Dashboard");
});
25
Kris Ivanov