私はAngularJSでカスタムディレクティブを構築する方法を学びたいと考えています。現在私はAngularJS 1.5.8を使用しています。"コントローラとして"隔離されていないディレクティブの分離スコープを持つ
コントローラーのスコープがではないが表示されている分離スコープのディレクティブの例を作成しようとしています。そのため、スコープを{}に追加して選択的に公開できます。この例では、は、を取得するには、 'Name:Street:'と表示されます。これは、ctrl.customerをディレクティブで使用できないようにするためです。それから、後で "scope:{}"に "customer: '='"を追加して、 "Name:David Street:123 anywhere street"を取得します。残念ながら、私は "名前:デイヴィッド・ストリート:123通りどこでも通り"と書かれています。私が試してみました
もの:
- 設定 "bindToController:真の"
- 取り外し "スコープを:{}" と "bindToController:{}" の設定(私は追加し、 "顧客を: '='"
- "bindToController:false"を設定してください(同様に正しいかもしれません)
- htmlを読み込んだ後にshift-F5キーを繰り返し押しても、古いファイルがキャッシュされていないことを確認してください。
testScope.js:
var app = angular.module('scopeModule',[]);
app.controller('Controller',[function(){
var vm = this;
vm.customer = {
name: 'David',
street: '123 anywhere street'
};
}]);
app.directive('sharedScope', function() {
return{
scope:{},
template: 'Name:{{ctrl.customer.name}} Street:{{ctrl.customer.street}}',
controller: 'Controller',
controllerAs: 'ctrl',
bindToController: true
};
});
index2.html:
あなたは間違います。独立スコープのポイントは、ディレクティブスコープが外側スコープから分離されていることを確認することです。このディレクティブを使用してビューの範囲を指定します。ディレクティブに独自のcontrollerAsがあり、コントローラがデータを公開している場合、もちろんこのディレクティブはこのデータにアクセスできます。 –
あるいは、この指令では少し違っていると言えます。コントローラーはそのスコープなので、何でも入れてもすぐにアクセスできます – maurycy