AngularJS+Flask 无法实例化模块



我几乎到处都在寻找这个,但如果我最终错过了一些东西,请原谅我。 这是我的网页:

<!DOCTYPE html>
<html>
<head>
<title>PDFHandle</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.5/angular.js"></script>
<script type="text/javascript" src="{{ url_for('static', filename='custom.js') }}"></script>
</head>
<body>
{% raw %}
<div ng-app="uploadApp" ng-controller="UploadController as uc">
<div ng-repeat="choice in uc.choices">
<input value="{{choice.value}}" />
</div>
<button ng-click="uc.addChoice()">Add</button>
</div>
{% endraw %}
</body>
</html>

这是我的AngularJS脚本:

var Try = angular.module("uploadApp", [])
.controller("UploadController", function UploadController() {
this.choices = [{id: "choice1", value:"Hello"}];
this.addChoice = function() {
return this.choices.push({id:"choice"+(this.choices.length+1), value:"Hello Again"});
};
})

我面临的问题是这个(显示在Chrome的开发人员工具中(:

Uncaught Error: [$injector:modulerr] Failed to instantiate module uploadApp due to:
Error: [$injector:nomod] Module 'uploadApp' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.

我可以通过通常将其与 HTML 文件链接来运行它,只是当我尝试将其与烧瓶渲染的 HTML 一起使用时,它不起作用。我也在其他 Angular IDE 上尝试过这个,它在它们中也运行良好。就像我说的,只是不适用于烧瓶。 任何帮助将不胜感激。谢谢!

像这样更改控制器

var Try = angular.module("uploadApp", []);
Try.controller("UploadController", function() {
this.choices = [{id: "choice1", value:"Hello"}];
this.addChoice = function() {
this.choices.push({id:"choice"+(this.choices.length+1), value:"Hello Again"});
};
})

你可以这样尝试,

angular.module("uploadApp", [])
.controller("UploadController", function UploadController() {
this.choices = [{id: "choice1", value:"Hello"}];
this.addChoice = function() {
return this.choices.push({id:"choice"+(this.choices.length+1), value:"Hello Again"});
};
})

最新更新