Angular ui-router を使用すると、コントローラーで使用できるさまざまなインジェクションを解決できます。
単純な汎用 ListController を作成し、ui-router で、その特定のビューに固有の CRUD 関数を含むオブジェクトをテンプレートと共に注入しています。
たとえば、同じ "crud" 構文を持つ 2 つのサービスがあるとします。
addPerson(person, callback){}
deletePerson(person, callback){}
editPerson(person, callback){}
....
addCar(car, callback){}
deleteCar(car, callback){}
editCar(car, callback){}
....
これらのサービスの CRUD 関数を汎用コントローラーにマップするマッピング オブジェクトを作成しました。これは、ui.router を介して注入されます。
汎用コントローラー:
controller('ListCtrl', ['$scope', 'itemList', 'functions', function ($scope, itemList, functions) {
$scope.itemList = itemList;
$scope.addItem = function(){
functions.add($scope.item, callback);
}
.....
}
ルーター:
.state('app.people', {
url: '/people',
templateUrl: 'views/people.html',
resolve: {
functions: ['People', function(People){
return {
add: People.createPerson,
update: People.updatePerson,
delete: People.deletePerson,
getItemList: People.getPeopleList
}
}],
itemList: ['$q', 'People', function($q, People){
var deferred = $q.defer();
People.getPeopleList(function(resp, status){
deferred.resolve(resp);
});
return deferred.promise;
}],
},
controller: 'GenericController'
})
そのため、状態定義に別の関数マッピングを挿入するだけで、車でも使用できます。
魅力のように機能します。
しかし、完全なビューだけでなく、div 内でコントローラーを使用できるようにしたいと考えています。ここに問題があります:
ng-controller ディレクティブを使用すると、インジェクターは、'itemList' または 'functions' (マッピング オブジェクト) として何を提供すればよいかわかりませんが、$controller オブジェクトを介してインスタンス化すると、'' t には独自のスコープがあり、
Unknown provider: $scopeProvider <- $scope
独自の子スコープを作成できないため.. $rootScope.$new() などを使用して新しいスコープを作成できると思いますが、ハッキングのように感じすぎます。角度的には、これはこのようなものには悪いアプローチかもしれないと思います..
任意のヒント?