カスタムディレクティブにBindToControllerが必要なのはなぜですか?この構文は、それを使用せずには達成できないものです。私は非常に多くのドキュメントを通過しましたが、私の答えは得られませんでした。前もって感謝します!!カスタムディレクティブにBindToControllerが必要な理由
0
A
答えて
1
Angularは、$ scopeに直接データを置くのではなく、むしろデータをコントローラに入れる代わりに、ユーザーを移動させようとしています。これに対する主な動機の1つは、コントローラが単純なクラスであり、単体テストがはるかに容易であるためです。
また、リンク機能を使用する代わりにコントローラを使用することは、主に同じ理由によるものです。リンク関数は、DOM操作や、jqueryプラグインをラップするか、DOMイベントに直接登録するなど、角度のないその他のものに対してのみ使用する必要があります。そこでここでは、一緒にそのすべてを置く
は、カスタムディレクティブ
angular.module('app').directive('person', function() {
return {
restrict: 'E',
controller: PersonDirectiveController,
controllerAs: 'vm',
bindToController: true,
scope: {
'age': '='
},
link: function(scope, element, attributes) {
}
};
});
function PersonDirectiveController() {
var vm = this;
vm.name = 'Bob';
//vm.age is passed in through scope and because of bindToController
}
を作成するための好ましい方法は、今、私たちは単にむしろ$の範囲で
describe('PersonDirectiveController', function() {
it('has a name', function() {
var vm = new PersonDirectiveController();
expect(vm.name).toEqual('Bob');
});
});
2
を対処するよりも、直接PersonDirectiveControllerをテストすることができますです
また、Angular 1.3で始まる指示文の中でcontrollerAs構文を使用することもできます。また、bindToController
プロパティを追加して、プロパティがスコープではなくコントローラに確実にバインドされるようにする必要があります。 は例有します:vm
のこのコントローラ別名で
(function() {
var app = angular.module('directivesModule');
app.directive('isolateScopeWithControllerAs', function() {
var controller = function() {
var vm = this;
vm.items = {}
vm.addItem = function() {
//Add new customer to directive scope
vm.items.push({
name: 'New Directive Controller Item'
});
};
};
var template = '<button ng-click="vm.addItem()">Add Item</button>' +
'<ul><li ng-repeat="item in vm.items">{{ ::item.name }}</li></ul>';
return {
restrict: 'EA', //Default for 1.3+
scope: {
datasource: '=',
add: '&',
},
controller: controller,
controllerAs: 'vm',
bindToController: true, //required in 1.3+ with controllerAs
template: template
};
});
}());
をcontrollerAs
プロパティに割り当てられ、エイリアスは、コントローラコードおよびビューで使用されています。 bindToController
プロパティはtrueに設定され、プロパティがスコープではなくコントローラにバインドされていることを確認します。
関連する問題
- 1. TextWatcherが必要な理由
- 2. RIAが必要な理由
- 3. "rec"が必要な理由
- 4. HerokuにResque 1.22.0が必要な理由
- 5. AMQPにmessageIdが必要な理由
- 6. RVMにYAMLが必要な理由
- 7. rvmにログインシェルが必要な理由
- 8. JDBC-ODBCにドライバが必要な理由
- 9. Dockerにユニオンファイルシステムが必要な理由
- 10. random.choiceのリストが必要な理由
- 11. メテオでパッケージインポートが必要な理由
- 12. Google Analytics UTMが必要な理由
- 13. ECUキャリブレーションが必要な理由
- 14. 識別子が必要な理由
- 15. refrehアクセストークンのリフレッシュトークンが必要な理由
- 16. mongodb getSisterDBが必要な理由
- 17. ハードリンクとソフトリンクが必要な理由
- 18. WPFでAutomationPropertiesが必要な理由
- 19. I2Cでクロックストレッチが必要な理由
- 20. return文が必要な理由を理解できない
- 21. 安全な文字列にforceとAsPlainTextが必要な理由
- 22. mapDispatchToPropsが既にある場合、redux-thunkが必要な理由
- 23. 割り込み処理が必要な理由
- 24. jsonデータソースにdojoグリッドに名前列が必要な理由
- 25. ファイルを開くために変数が必要な理由
- 26. 検索に別の検索サーバーが必要な理由
- 27. SwiftのinstantiateViewController(withIdentifier :)の後にダウンキャストが必要な理由
- 28. telnetlib read_all()の後にexit()またはexecが必要な理由
- 29. Railsコントローラのアクションメソッドにパラメータが必要な理由
- 30. ジェムセット使用時に `bundle exec`が必要な理由は?
また、Controller inディレクティブを作成する理由についても説明します。 –