1

angularjs サービスの約束を消費するコントローラーがあります。コントローラーに対してジャスミン単体テストを作成したため、コントローラー関数は次のようになります。

this.getTodos = function () {
    TodoService.getTodos().then(function (todos) {
        $scope.Todos = todos;
      },
        function (error) {
            // TODO: display the error pop up
            console.log(error);
        });
};

これはビューでは機能しないようですか？関数を次のように変更すると:

 TodoService.getTodos().then(function (todos) {
        $scope.Todos = todos;
      },
        function (error) {
            // TODO: display the error pop up
            console.log(error);
        });

それは機能しますが、コントローラー機能をテストできません。私の好みの方法は、this.getTodos、this.saveTodo、this.DeleteTodo などとして使用することです....

何か提案はありますか？

どうもありがとう

====>>更新

前述のように、テストはすべて機能していますが、ビューにはデータが表示されません。コントローラ this.getTodos はまったく呼び出されていないようです。....Angular ViewにコントローラーgetTodosを使用させる方法がわかりません...テストは以下のとおりです。

次のジャスミン テストは正常に動作します。

    it("Reading todos...", inject(function ($q) {

        var deferredRead = $q.defer();
        spyOn(todoServiceMock, "getTodos").and.returnValue(deferredRead.promise);
        deferredRead.resolve([{ TodoId: 10, Description: "Test", Completed: false },
        { TodoId: 11, Description: "Test", Completed: false }]);
        todoController.getTodos();
        scope.$apply();

        expect(scope.Todos.length).toBe(2);
    }));

    it("Reading todos, error...", inject(function ($q) {

        var deferredRead = $q.defer();
        spyOn(todoServiceMock, "getTodos").and.returnValue(deferredRead.promise);
        deferredRead.reject("There are no todos available!");
        todoController.getTodos();
        scope.$apply();

        expect(scope.Todos.length).toBe([]);
    }));

ただし、ビューは行にデータを入力しません...

ビューには次のようなコードがあります。

<tr class="animate" ng-repeat="Todo in Todos | orderBy:'TodoId' | filter: filterTodo">
                    <td class="col-sm-1">{{Todo.TodoId}}</td>
                    <td class="col-sm-3">{{Todo.Description}}</td>
                    <td class="col-sm-1">
                        <span class="glyphicon glyphicon-check" ng-show="   {{Todo.Completed}}==true"></span>
                        <span class="glyphicon glyphicon-unchecked" ng-show="{{Todo.Completed}}==false"></span>
                    </td>
                    <td class="col-sm-2">
                        <a href="" ng-click="selectTodo(Todo)"><span class="glyphicon glyphicon-edit"></span></a>
                    </td>
                </tr>
4

1 に答える 1

1

呼び出すように指示しないと、Angular はスコープから関数を呼び出しません。したがって、基本的に3つの選択肢があります。

  1. 2 回目の試行で行ったように実行します

  2. インスタンス化されたら、コントローラーで関数を呼び出します。

    this.getTodos = function () { ... }; // define the method
this.getTodos(); // call it

  3. ビューで使用ng-initして関数を呼び出しgetTodos()ます。

最初または 2 番目の手法を使用しても、コントローラーの単体テストが妨げられることはないことに注意してください。ユニークな違いは、関数が呼び出されたときにインスタンス化された後にサービスが呼び出されることを期待するのではなく、コントローラーがインスタンス化されたとき(つまり、が呼び出されたとき) にサービス呼び出しが行われることをテストで想定する必要があることです。$controller('TodoController')getTodos()

于 2014-06-21T09:42:30.737 に答える