0
私はDigging into Angular's "Controller as" syntaxの記事を読んでいました。指示文の中で "Controller as"構文を使用するためのスニペットを示しています。controllerAsの構文で共通ディレクティブを定義する方法は？
app.directive('myDirective', function() {
return {
restrict: 'EA',
replace: true,
scope: true,
template: [].join(''),
controllerAs: '', // woohoo, nice and easy!
controller: function() {}, // we'll instantiate this controller "as" the above name
link: function() {}
};
});
ここではコントローラ名controllerのプロパティを設定する必要があります。今私が複数のコントローラで使用したい共通ディレクティブを定義したい場合、どうすればいいですか？
編集1：
私が達成したいかについてコードを掲示しています。表示にはファイルの入力タグがあり、ファイルが選択されたときにはその名前とコンテンツタイプが必要です。私は入力タグの変更イベントを使用します。私はどのようにファイルオブジェクトを自分のVMに渡すことができるのか分かりません。私は、複数のコントローラのファイルに関する情報を取得するためにchangeイベントを使用するディレクティブを使用したいと思います。
index.htmlを
<!DOCTYPE html>
<html lang="en" ng-app="myApp">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.js"></script>
<script src="/myCtrl.js"></script>
</head>
<body ng-controller="MyController as vm">
<input name="file" type="file" file />
<input type="button" ng-click="vm.upload(vm.file);" value="Upload" />
</body>
</html>
myCtrl.js
var app = angular.module('myApp', []);
app.controller('MyController', MyController);
MyController.$inject = ['$http'];
function MyController($http) {
var vm = this;
vm.file = null;
vm.upload = function(file) {
$http.post('/upload', { filename: file.name, contentType: file.type })
.success(function(resp) {
console.log(resp);
})
.error(function(resp) {
console.log(resp);
});
}
}
app.directive('file', function() {
return {
restrict: 'AE',
scope: true,
controllerAs: 'vm',
link: function(scope, el, attrs){
el.bind('change', function(event){
var files = event.target.files;
var file = files[0];
// What to write here to pass file object into vm ?
// Below line is for that controller design which uses $scope service. But I am using controllerAs syntax
// scope.file = file;
// scope.$apply();
});
}
};
});
を使用して他のすべてのコントローラに受け取るのでしょうあなたは
$broadcastを使用することができ、編集された質問をご確認ください。 – Xyroid