Question

Angular的新手。非常直截了当的问题。我有以下代码。

我只是想在下面显示文件数量。我将fileCount变量绑定到范围，但它不起作用。

＆＃13;

var app = angular.module('fileUploader', []);

app.controller('upload', function($scope){
	$scope.fileCount = 0;
})

.directive("customDirective", function(){
	return{
		link: function(scope, el, attrs){
			el.bind("change", function(event){
				console.log(event.target.files.length);
				scope.fileCount = event.target.files.length;
			});

		}
	}

});

＆＃13;

	<head>
      <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
	</head>
	<body>
	<div ng-app="fileUploader" ng-controller="upload">
		<input custom-Directive type="file"/>
		<p>The file count is: {{fileCount}}</p>
	</div>		
	</body>

＆＃13;

Answer 1

指令从其父级继承范围属性，但是每当您更改对父级属性的引用时，它都不知道启动摘要周期，所以你必须这样做手动（查看此working jsbin）：

.directive("customDirective", function(){
    return{
        link: function(scope, el, attrs){
            el.bind("change", function(event){
              scope.fileCount = event.target.files.length;

              scope.$apply(); // notice this
            });
        }
    }
});

这将开启摘要周期，您将看到更新按预期发生。

AngularJS从指令链接函数到控制器的Pass值

1 个答案: