使用指令的方法更新控制器的范围
Updating a controller's scope using a directive's method
如何使用指令中的方法更新控制器作用域中的变量?
我正在使用:Dropzone.js and angular-dropzone.js.
Dropzone 的方法之一是 .getQueuedFiles()
。我想使用此方法更新控制器范围内的变量,但它不起作用。我希望能够更新控制器范围,以便我可以显示和隐藏内容并将文件数量传递给表单中的下一步。
这里是 angular:
.controller('ImagesCtrl', function($scope) {
$scope.queuedFiles = 0;
$scope.dropzoneConfig = {
init: function() {
this.on("addedfile", function(file) {
$scope.queuedFiles = $scope.dropzone.getQueuedFiles().length;
});
}
};
})
这里是 html:
<form class="dropzone clear"
method="post"
enctype="multipart/form-data"
ng-dropzone
dropzone="dropzone"
dropzone-config="dropzoneConfig">
</form>
<div>Queued Files: {{queuedFiles}}</div>
这是正确的代码
var app = angular.module('myApp', ['ui.router', 'myApp.controllers']).
config(['$stateProvider', '$urlRouterProvider',
function ($stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise('/');
$stateProvider
.state('app', {
url: '/',
templateUrl: 'admin.html',
onEnter: function ($stateParams) {
console.log("Entered Admin route");
}
//controller: 'myController'
})
.state('sitebinding', {
url: '/sitebinding',
templateUrl: 'sitebinding.html'
})
.state('scrum', {
url: '/scrum',
templateUrl: 'scrum.html'
});
}
]);
angular.module('myApp.controllers', []).
controller('myController', function ($scope) {
$scope.models = {
helloAngular: 'I work!'
};
$scope.$on('$stateChangeStart', function (evt, toState, toParams, fromState, fromParams) {
console.log('In state change start');
})
});
这就是问题所在:当您第二次编写 angular.module('myApp', []) 指定依赖项来定义您的控制器时,您覆盖了原始模块。
如果您想向现有模块添加新内容,则无需传递依赖项数组
angular.module('myModule').控制器('MyCtrl',函数....
如何使用指令中的方法更新控制器作用域中的变量?
我正在使用:Dropzone.js and angular-dropzone.js.
Dropzone 的方法之一是 .getQueuedFiles()
。我想使用此方法更新控制器范围内的变量,但它不起作用。我希望能够更新控制器范围,以便我可以显示和隐藏内容并将文件数量传递给表单中的下一步。
这里是 angular:
.controller('ImagesCtrl', function($scope) {
$scope.queuedFiles = 0;
$scope.dropzoneConfig = {
init: function() {
this.on("addedfile", function(file) {
$scope.queuedFiles = $scope.dropzone.getQueuedFiles().length;
});
}
};
})
这里是 html:
<form class="dropzone clear"
method="post"
enctype="multipart/form-data"
ng-dropzone
dropzone="dropzone"
dropzone-config="dropzoneConfig">
</form>
<div>Queued Files: {{queuedFiles}}</div>
这是正确的代码
var app = angular.module('myApp', ['ui.router', 'myApp.controllers']).
config(['$stateProvider', '$urlRouterProvider',
function ($stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise('/');
$stateProvider
.state('app', {
url: '/',
templateUrl: 'admin.html',
onEnter: function ($stateParams) {
console.log("Entered Admin route");
}
//controller: 'myController'
})
.state('sitebinding', {
url: '/sitebinding',
templateUrl: 'sitebinding.html'
})
.state('scrum', {
url: '/scrum',
templateUrl: 'scrum.html'
});
}
]);
angular.module('myApp.controllers', []).
controller('myController', function ($scope) {
$scope.models = {
helloAngular: 'I work!'
};
$scope.$on('$stateChangeStart', function (evt, toState, toParams, fromState, fromParams) {
console.log('In state change start');
})
});
这就是问题所在:当您第二次编写 angular.module('myApp', []) 指定依赖项来定义您的控制器时,您覆盖了原始模块。
如果您想向现有模块添加新内容,则无需传递依赖项数组
angular.module('myModule').控制器('MyCtrl',函数....