将此代码放在我的 angular 项目中的何处？

Question

我有一些用于在我的 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" },
                ]
            }
        ]
    }
];
}

Answer 1

所以基本上 Angular 与组件一起工作。 一个组件基本上只是网站的一个独立部分，比如它可以是一个导航栏、一个侧边栏、一个帖子组件等。一个组件有两个主要部分，HTML 文件和 JS 文件，两者都链接在一起。 所以基本上你刚刚展示的第一段代码将用于组件的 JS 部分的 HTML 和 Javascript。

这是有关其工作原理的更多信息，特别是有关如何创建 Angular 组件的信息。

PS：在 TS（Typescript，一种从 Javascript 继承但具有强类型化的语言）文件中，您的 Javascript 将放在那里。

我希望这有帮助，如果您需要更多信息，请告诉我：D

将此代码放在我的 angular 项目中的何处？

问题描述

1 个解决方案

解决方案1
1 2020-02-10 12:09:15

将此代码放在我的 angular 项目中的何处？

问题描述

1 个解决方案

解决方案1 1 2020-02-10 12:09:15

解决方案1
1 2020-02-10 12:09:15