クソコード を書いたはいいが、釈然としなかった。 "View independent business logic: Services" とドキュメントに書いてある通りなので、やはり他のやりかたのほうがよい。のでよくよく読んだところ、やはり View にかかわる部分は Directive に集約されるようだ…… しかし使いかたが非常に難しい。

iimsApp.directives.directive('dialog', function ($q) {
    return {
        restrict: 'E',
        transclude : true,
        scope : {
            Dialog : '=name'
        },
        controller : function ($scope) {

            $scope.Dialog = {
                open : function (title) {
                    $scope.deferred = $q.defer();
                    $scope.title = title;
                    $scope.show  = true;
                    return $scope.deferred.promise;
                }
            };

            $scope.close = function () {
                $scope.show = false;
            };

            $scope.ok = function () {
                $scope.close();
                $scope.deferred.resolve();
            };

            $scope.cancel = function () {
                $scope.close();
                $scope.deferred.reject();
            };
        },
        templateUrl : '/static/js/app/dialog.html'
    };
});

こんな感じで dialog という directive を定義して、

<div ng-controller="FooCtrl">
    <dialog name="FooBarDialog">
        {{ message }}
    </dialog>
</div>

というふうにすると、FooCtrl のスコープから FooBarDialog というプロパティで見えるようになる。つまり

        $scope.message = "Hello!";
        $scope.FooBarDialog.open('OKK!!!!!').then(function () {
            alert('ok');
        }, function () {
            alert('cancel');
        });

みたいなあ

1. トップ
2. tech
3. Angular JS で View を伴う Service 的なことをしたいとき、あるいは Directive に Controller をつけたいとき。

よくわからなかったので以下のようにしましたが、まっとうな方法には思えないので正しいやりかたをおしえていただきたく申し上げます……

• factory で空のオブジェクトをかえしとく
• view に紐付けた controller で factory で作ったオブジェクトを初期化する
• 作った Service を依存に加えて使う

一応、controller 間は直接依存しない (Service を mock にさしかえれば動く) のでユニットテストは書けると思うけど、よくわかりません……

myApp.factory('DialogService', function () { return { } });
myApp.controller('DialogControl', function ($scope, $q, DigalogService) {
	DialogService.open = function (title, message) {
		$scope.deferred = $q.defer();
		$scope.show = true;
		return $scope.deferred.promise;
	};

	$scope.close = function () {
		$scope.show = false;
		$scope.deferred = null;
	};

	$scope.ok = function () {
		$scope.deferred.resolve(true);
	};
});


// User
myApp.controller('FooController', function ($scope, DialogService) {
	DialogService.open('foo', 'bar').then(function () {
		...
	});
});

1. トップ
2. tech
3. Angular JS でビューを伴う Service ってどう書けばいいんですか