簡體   English   中英

將此代碼放在我的 angular 項目中的何處?

[英]where to put this code in my angular project?

我有一些用於在我的 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。

這是有關其工作原理的更多信息,特別是有關如何創建 Angular 組件的信息。

PS:在 TS(Typescript,一種從 Javascript 繼承但具有強類型化的語言)文件中,您的 Javascript 將放在那里。

我希望這有幫助,如果您需要更多信息,請告訴我:D

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM