【问题标题】:Updating a controller's scope using a directive's method使用指令的方法更新控制器的范围
【发布时间】:2015-03-20 19:33:24
【问题描述】:

如何使用指令中的方法来更新控制器范围内的变量?

我正在使用:Dropzone.jsangular-dropzone.js

Dropzone 的方法之一是.getQueuedFiles()。我想使用此方法更新控制器范围内的变量,但它不起作用。我希望能够更新控制器范围,以便我可以显示和隐藏内容并将文件数量传递给表单中的下一步。

这是角度:

.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>

【问题讨论】:

    标签: angularjs angularjs-directive angularjs-scope dropzone.js


    【解决方案1】:

    这是正确的代码

    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').controller('MyCtrl', function....

    【讨论】:

      猜你喜欢
      • 2015-04-30
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2015-07-20
      • 1970-01-01
      • 2015-01-11
      相关资源
      最近更新 更多