Javascript AngularJS:缩小后指令中无法访问范围
在对许多示例进行缩小(使用闭包编译器)之后,访问指令中链接函数的作用域是“未定义”的,但在进行缩小之前效果很好 例如,下面的代码来自角度教程,有一些改动。缩小后,指令在任何时候都不会拾取$scope.format。该指令显示默认格式(2015年7月15日),没有任何错误。缩小之前,指令显示$scope.format(7/15/2015 12:09:04 AM)中定义的格式 app.jsJavascript AngularJS:缩小后指令中无法访问范围,javascript,angularjs,minify,angular-directive,Javascript,Angularjs,Minify,Angular Directive,在对许多示例进行缩小(使用闭包编译器)之后,访问指令中链接函数的作用域是“未定义”的,但在进行缩小之前效果很好 例如,下面的代码来自角度教程,有一些改动。缩小后,指令在任何时候都不会拾取$scope.format。该指令显示默认格式(2015年7月15日),没有任何错误。缩小之前,指令显示$scope.format(7/15/2015 12:09:04 AM)中定义的格式 app.js .controller('Controller', ['$scope', function ($scope)
.controller('Controller', ['$scope', function ($scope) {
$scope.format = 'M/d/yy h:mm:ss a';
}])
.directive('myCurrentTime', bd.myCurrentTime.Directive.factory)
myCurrentTime-directive.js
'use strict';
goog.provide('bd.myCurrentTime.Directive.factory');
/**
* Example directive factory.
*
* @return {Object}
* @ngInject
* @export
*/
bd.myCurrentTime.Directive.factory = function ($interval, dateFilter) {
function link(scope, element, attrs) {
var format,
timeoutId;
function updateTime() {
element.text(dateFilter(new Date(), format));
}
scope.$watch(attrs.myCurrentTime, function (value) {
format = value;
updateTime();
});
element.on('$destroy', function () {
$interval.cancel(timeoutId);
});
// start the UI update process; save the timeoutId for canceling
timeoutId = $interval(function () {
updateTime(); // update DOM
}, 1000);
}
return {
link: link
};
};
// Added by ng-annotate
bd.myCurrentTime.Directive.factory.$inject = ["$interval", "dateFilter"];
html文件:
<div ng-controller="Controller">
Date format: <input ng-model="format"> <hr />
Current time is: <span my-current-time="format"></span>
</div>
日期格式:
当前时间为:
是否使用闭包编译器的高级编译模式?如果看不到缩小的代码,很难找出问题所在,但以下是一些想法:
.controller('Controller', ['$scope', function ($scope) {
$scope.format = 'M/d/yy h:mm:ss a';
}])
$scope.format
可能会重命名为类似于s.f
的名称。通常,这不会是一个问题,特别是因为$scope
被正确地注入。但是,您在HTML中引用了format
属性,闭包编译器不知道该属性:
Date format: <input ng-model="format"> <hr />
Current time is: <span my-current-time="format"></span>
日期格式:
当前时间为:
尝试改用$scope['format']='M/d/yy h:mm:ss a'
——闭包编译器从不更改字符串,因此应该为HTML导出正确的属性名称。现在,记住-attrs.myCurrentTime
可能被重命名为类似于a.m
。尝试使用字符串属性名(attrs['myCurrentTime']
),以确保编译的JavaScript与HTML正确匹配再说一次,在这一点上,这些只是想法。如果您将缩小代码作为完整示例发布,我们将能够提供更多帮助。您能为缩小和非缩小变体提供plunkr吗?您使用什么库进行缩小?@tomepejo第一句话,他使用的是谷歌的闭包编译器。@Agop,我想是高级模式,谷歌的闭包编译器不能将
$scope.format
缩小为$scope.f
,而是将其删除,因为它没有在function@Grundy是的,那也有可能。这就是为什么我们需要看到缩小的代码。无论哪种方式,使用字符串导出都会有所帮助,这是基于到目前为止我们必须处理的内容。非常感谢您的帮助。现在这更有意义了。想法1没有什么区别(因为缩小的代码中仍然有x.format)。然而,idea 2解决了这个问题,并且在我正在编写的更复杂的应用程序中也解决了这个问题。干杯