当我为ng-app属性添加名称时,我无法弄清楚为什么Angular会抛出错误。
Chrome中的错误是“未捕获的对象”,位于angular.js的第36行function minErr(module) {
我正在使用缩小的角度库from googleapis。
如果我只是<html ng-app>
,则没有错误。只要我<html ng-app="app">
,Angular就不再有效了。
编辑: 添加我的代码。
HTML
```
<html lang='en' ng-app=''>
<head>
<title>Show</title>
<meta charset='utf-8'>
<meta content='width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0' name='viewport'>
<meta content='IE=edge' http-equiv='X-UA-Compatible'>
<meta content="authenticity_token" name="csrf-param" />
<meta content="OTLcsbbFM0FzoPfIWnn8SDke6kTDnVSTG+EuP8SjQC0=" name="csrf-token" />
<link data-turbolinks-track="true" href="/assets/application.css?body=1" media="all" rel="stylesheet" />
<!-- Touch icon (uncomment if needed) -->
<!-- %link{ href: asset_path('apple-touch-icon-144x144.png'), rel: 'apple-touch-icon', sizes: '144x144' } -->
<!-- Placed at the top of the document 'cause of turbolinks -->
<script data-turbolinks-track="true" src="/assets/i18n.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/i18n/translations.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/turbolinks-spinner.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/twbs.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/application.js?body=1"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.min.js"></script>
<!--[if lte IE 8]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<script src="/assets/respond.js"></script>
<![endif]-->
</head>
<div class='container' id='main-container'>
<!-- <script src="/sortable.js" /> -->
<script>
function PlansCtrl($scope){
$scope.plan = {"id":1,"name":"Sample plan — four days a week","plan_blocks":[{"id":1,"name":"Monday","set_templates":[{"id":3,"exercise_id":14,"exercise_name":"Power Clean","weight":100,"reps":2},{"id":7,"exercise_id":14,"exercise_name":"Power Clean","weight":10,"reps":5},{"id":4,"exercise_id":17,"exercise_name":"Hang Clean","weight":100,"reps":2},{"id":5,"exercise_id":19,"exercise_name":"Push Up","weight":2,"reps":2},{"id":6,"exercise_id":21,"exercise_name":"Pull Up","weight":5,"reps":5}]},{"id":15,"name":"Tuesday","set_templates":[]}]}
}
</script>
<p id="notice"></p>
<h3>Sample plan — four days a week
<br /><small>There are 2 blocks in this plan.</small>
</h3>
<p>
<a href="/plans/1/plan_blocks/new">
<button type="button" class="btn btn-default">Add a block</button>
</a></p>
<hr />
<div ng-controller="PlansCtrl">
<a ng-repeat-start="block in plan.plan_blocks" href="/plan_blocks/{{block.id}}">{{block.name}}</a>
<a href="/plan_blocks/{{block.id}}/set_templates/new">
<button type="button" class="btn btn-default">Add a set</button>
</a>
<div class="table-responsive" ng-repeat-end>
<table class="table table-striped">
<thead>
<tr>
<th>Exercise</th>
<th>Weight</th>
<th>Reps</th>
</tr>
</thead>
<tbody>
<tr ng-if="block.set_templates.length == 0"><td colspan=3>No sets</td></tr>
<tr ng-repeat="set_template in block.set_templates">
<td>{{set_template.exercise_name}}</td>
<td>{{set_template.weight}} kg</td>
<td>{{set_template.reps}}</td>
</tr>
</tbody>
</table>
</div>
</div >
```
答案 0 :(得分:2)
您需要创建appModule
才能使用命名应用。
<html ng-app="App">
<head>
<script>
var app = angular.module('App',[]);
app.controller("PlansCtrl", function($scope) {
$scope.plan = {"id":1,"nam ....
});
</script>
</head>
<body ng-controller="PlansCtrl"></body>
</html>
答案 1 :(得分:0)
我建议在第78行的angular.js文件中添加一个断点
return new Error(message);
并查看消息以查看错误。
你也可以在Chrome控制台上使用F12来查看是否有错误。
另外请确保在app.js中更改应用名称
第二行:
angular.module('App',