Klu*_*dge 3 angularjs angular-ui angular-ui-bootstrap
我想用一个简单的弹出日期选择器与angularui喜欢这样.当我将标记和javascript代码复制到我的应用程序时,我得到了这个:
TypeError: Cannot use 'in' operator to search for 'show-weeks' in undefined
at link (http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.10.0.js:1247:43)
at nodeLinkFn (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.8/angular.js:6220:13)
at compositeLinkFn (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.8/angular.js:5630:15)
at compositeLinkFn (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.8/angular.js:5633:13)
at compositeLinkFn (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.8/angular.js:5633:13)
at compositeLinkFn (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.8/angular.js:5633:13)
at nodeLinkFn (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.8/angular.js:6214:24)
at compositeLinkFn (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.8/angular.js:5630:15)
at compositeLinkFn (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.8/angular.js:5633:13)
at compositeLinkFn (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.8/angular.js:5633:13) <input type="text" class="form-control ng-pristine ng-valid" datepicker-popup="{{format}}" ng-model="dt" is-open="opened" min="minDate" max="'2015-06-22'" datepicker-options="dateOptions" date-disabled="disabled(date, mode)" ng-required="true" close-text="Close"> angular.js:9413
(anonymous function) angular.js:9413
(anonymous function) angular.js:6832
nodeLinkFn angular.js:6223
compositeLinkFn angular.js:5630
compositeLinkFn angular.js:5633
compositeLinkFn angular.js:5633
compositeLinkFn angular.js:5633
nodeLinkFn angular.js:6214
compositeLinkFn angular.js:5630
compositeLinkFn angular.js:5633
compositeLinkFn angular.js:5633
publicLinkFn angular.js:5535
(anonymous function) angular.js:1303
Scope.$eval angular.js:11949
Scope.$apply angular.js:12049
(anonymous function) angular.js:1301
invoke angular.js:3704
doBootstrap angular.js:1299
bootstrap angular.js:1313
angularInit angular.js:1262
(anonymous function) angular.js:20549
trigger angular.js:2341
(anonymous function) angular.js:2612
forEach angular.js:309
eventHandler
我可以发布我的应用程序的代码,但它基本上是这样的:
angular.module('appName', ['ui.bootstrap'])
.controller("MyCtrl", function MyCtrl($scope, $http) {
$scope.today = function() {
$scope.dt = new Date();
};
// ... the rest of the code EXACTLY like in the plnkr
});
<html ng-app="appName">
<div ng-controller="MyCtrl">
<p class="input-group">
<input type="text" class="form-control" datepicker-popup="{{format}}" ng-model="dt"
is-open="opened" min="minDate" max="'2015-06-22'" datepicker-options="dateOptions"
date-disabled="disabled(date, mode)" ng-required="true" close-text="Close" />
<span class="input-group-btn">
<button class="btn btn-default" ng-click="open($event)">
<i class="glyphicon glyphicon-calendar"></i>
</button>
</span>
</p>
</div>
</html>
我也使用了plnkr中出现的SAME angularjs/angularui/bootstrap CDN.为什么在我的应用程序中发生这种情况,而在plnkr中它工作得很好？!
编辑:
在没有得到任何答案之后,我决定在第1247行更改angularui的源代码,异常上升.我不是世界上最好的javascript程序员,所以我datepickerOptions在使用运算符之前确保它是一个对象in:
if (!((typeof(datepickerOptions) === "object")) || !('show-weeks' in datepickerOptions)) {
scope.showWeeks = datepickerConfig.showWeeks;
} else {
scope.showWeeks = datepickerOptions['show-weeks'];
}
我仍然在寻找一个真正的解决方案.
小智 6
去掉 datepicker-options="dateOptions"
您可以在弹出设置下 的文档中看到
datepicker的选项可以使用datepicker-options属性作为JSON传递.
您复制的示例datepicker-options="dateOptions"在指令中使用.该错误告诉您Angular正在尝试查找show-weeks设置的值dateOptions.问题是,dateOptions未在html中定义.
查看示例中的JavaScript,您将看到缺少的变量在控制器的范围中定义.
$scope.dateOptions = {
'year-format': "'yy'",
'starting-day': 1
};