我对 Angular 非常陌生,我试图了解这里发生的事情。我有两个不同的模块。 'defaultValueSelect'用于从水果选项菜单中选择,另一种用于从日历中选择日期。这两个单独工作得很好(当我说单独时,我的意思是我完全删除其中一个的 html 和脚本,而让另一个继续)。当我将它们一起运行时,只有其中一个起作用。请帮忙
<body>
<script>
angular.module('defaultValueSelect', [])
.controller('ExampleController', ['$scope', function ($scope) {
$scope.data = {
availableOptions: [
{ id: '1', name: 'Option A' },
{ id: '2', name: 'Option B' },
{ id: '3', name: 'Option C' }
],
selectedOption: { id: '3', name: 'Option C' } //This sets the default value of the select in the ui
};
}]);
angular
.module('firstApplication', ['ngMaterial', 'ngMessages'])
.controller('dateController', dateController);
function dateController($scope) {
$scope.myDate = new Date();
$scope.minDate = new Date(
$scope.myDate.getFullYear(),
$scope.myDate.getMonth(),
$scope.myDate.getDate());
$scope.maxDate = new Date(
$scope.myDate.getFullYear(),
$scope.myDate.getMonth() + 2,
$scope.myDate.getDate());
}
</script>
<div ng-app="defaultValueSelect" ng-controller="ExampleController">
<form name="myForm">
<label for="mySelect">Make a choice:</label>
<select name="mySelect" id="mySelect"
ng-options="option.name for option in data.availableOptions track by option.id"
ng-model="data.selectedOption"></select>
</form>
<hr>
<tt>option = {{data.selectedOption}}</tt><br />
</div>
<h1>sdfdsaf</h1>
<div class="row">
<div class="col-md-4">
</div>
<div ng-app="firstApplication">
<div class="datepickerdemo" ng-controller="dateController as ctrl" ng-cloak>
<div class="col-md-4">
<h4> Select Date</h4>
<md-datepicker ng-model="ctrl.myDate"
md-placeholder="enter date"
md-min-date="minDate"
md-max-date="maxDate">
</md-datepicker>
</div>
</div>
</div>
<div class="col-md-4">
</div>
</div>
</body>
</html>
最佳答案
您的应用程序中应该有一个主模块,您可以将其他模块注入(inject)到主模块中:
angular.module('defaultValueSelect', ['firstApplication'])
然后在 ng-app 的 HTML 中仅声明主模块
<div ng-app="defaultValueSelect">.....</div>
此外,您可以为不同的代码块声明 ng-controller。
希望对你有帮助!!
关于javascript - 为什么模块无法正常工作?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44705606/