我有一些用于在我的 Angular 元素中创建层次结构树的代码 我不确定在哪里使用此代码。
所以只有两个代码 - 一个是 HTML,另一个是 javascript
我使用 ng new 命令创建了一个 Angular 元素,因此它生成了所有文件。
您能指导我在哪里放置这些代码吗?
html代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>AngularJS Tree Demo</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.min.js"></script>
</head>
<body ng-app ng-controller="SampleController">
<script type="text/ng-template" id="treeLevel.html">
<ul>
<li ng-repeat="item in items">
<input type="checkbox"
name="itemSelection"
ng-model="item._Selected" />
{{item.text}}
<div ng-include=" 'treeLevel.html'"
onload="items = item.children">
</div>
</li>
</ul>
</script>
<div ng-include=" 'treeLevel.html' "
onload="items = sourceItems">
</div>
<pre> {{sourceItems | json}} </pre>
</body>
</html>
java脚本是:
function SampleController($scope) {
$scope.sourceItems = [
{
text: "Item A",
children: [
{
text: "Item A-1",
children: [
{
text: "Item A-1-1"
}, {
text: "Item A-1-2"
}
]
}, {
text: "Item A-2"
}, {
text: "Item A-3"
},
]
}, {
text: "Item B",
children: [
{ text: "Item B-1" },
{ text: "Item B-2" },
{
text: "Item B-3",
children: [
{ text: "Item B-3-1" },
{ text: "Item B-3-2" },
]
}
]
}
];
}
最佳答案
所以基本上 Angular 与组件一起工作。组件基本上只是网站的一个独立部分,就像它可以是导航栏、侧边栏、帖子组件等。组件有两个主要部分,HTML 文件和 JS 文件,并且它们都链接在一起。因此,基本上,您刚刚展示的第一段代码将用于组件的 JS 部分的 HTML 和 Javascript。
Here is more information关于它是如何工作的,特别是关于如何创建 Angular 组件。
PS:TS(Typescript,一种继承自 Javascript 但具有强类型的语言)文件中是您的 Javascript 所在的位置。
我希望这有帮助,如果您需要更多信息,请告诉我:D
关于javascript - 将此代码放在我的 Angular 元素中的哪里?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60149741/