[英]My AngularJS code doesn't work
I am learning AngularJS and ended up with the following code for ToDoList basic app.我正在学习 AngularJS,最后得到了 ToDoList 基本应用程序的以下代码。 I viewed it in a browser it didn't work.
我在浏览器中查看它不起作用。 I am new to the Angular and mightn't get obvious things, so I thought if my app name is
我是 Angular 的新手,可能不会得到明显的东西,所以我想如果我的应用程序名称是
todoApp
Then I should put那我应该把
$scope.todoApp
instead of代替
$scope.todo
but turned out that's not an issue.但事实证明这不是问题。
<!DOCTYPE html>
<html ng-app="todoApp">
<head>
<title>To DO List</title>
<link href="bootstrap.css" rel="stylesheet">
<link href="bootstrap-theme.css" rel="stylesheet>
<script type="text/javascript" src="angular.min.js"></script>
<script type="text/javascript">
var model = {
user: "Adam",
items: [{ action: "Buy flowers", done: false },
{ action: "Get Shoes", done: false },
{ action: "Collect Tickets", done: true },
{ action: "Call Joe", done: false }]
};
var todoApp = angular.module("todoApp", []);
todoApp.controller("ToDoCtrl", function($scope) {
$scope.todo = model;
});
</script>
</head>
<body ng-controller="ToDoCtrl">
<div class="page-header">
<h1>
{{todo.user}}'s To Do List
<span class="label label-default">{{todo.items.length}}</span>
</h1>
</div>
<div class="panel">
<div class="input-group">
<input class="form-control" />
<span class="input-group-btn">
<button class="btn btn-default">Add</button>
</span>
</div>
<table class="table table-striped">
<thead>
<tr>
<th>Description</th>
<th>Done</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="item in todo.items">
<td>{{item.action}}</td>
<td><input type="checkbox" ng-model="item.done" /></td>
<td>{{item.done}}</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
That's what I get in a browser..这就是我在浏览器中得到的..
And that's what I guess I am supposed to get...这就是我想我应该得到的......
Why it doesn't work?为什么它不起作用?
Your HTML
getting invalid because you are missing "
in link tag's rel
attribute. Here you are missing:你的
HTML
变得无效,因为你在链接标签的rel
属性中缺少"
。在这里你丢失了:
<link href="bootstrap-theme.css" rel="stylesheet>
^ ==> missing "
Working DEMO /* updated css */
工作演示
/* updated css */
Have a look at Invalid HTML in DEMO .看看DEMO中的 Invalid HTML 。 Here you can see after
link
tag HTML is colored green.在这里你可以看到
link
标签 HTML 被染成绿色。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.