にはngIncludeを使用した複数の部分が含まれています

WebAppをangularJSとしています。私には何かがあります。にはngIncludeを使用した複数の部分が含まれています

<!doctype html> 
<html> 
<head> 
<title>webapp</title> 
<link href="css/angular-bootstrap.css" rel="stylesheet"> 
<link href="css/style.css" rel="stylesheet"> 
<script src="js/angular-bootstrap.js" type="text/javascript"></script> 
<script src="js/app.js"></script> 
</head> 

<body ng-app="app"> 

<div class="container"> 
    <h1>WebApp</h1> 
    <div ng-controller="home as homeCtrl" ng-cloak class="ng-cloak" class="wrapper"> 
     <div ng-include="'blocks/item.html'"></div> 
     <div ng-include="'blocks/something.html'"></div> 
     <div ng-include="'blocks/health.html'"></div> 
     <div ng-include="'blocks/mana.html'"></div> 
     <div ng-include="'blocks/running.html'"></div> 
     <div ng-include="'blocks/out.html'"></div> 
     <div ng-include="'blocks/of.html'"></div> 
     <div ng-include="'blocks/ideas.html'"></div> 
    </div> 
</div> 
</body> 

</html>

すべての項目は、別のインクルードを記述する必要があります。 1つのコマンドでこれらの機能や追加機能を将来に含める方法はありますか？

出典

2016-04-05 ziraak

まず、お使いのコントローラであなたのテンプレートで、（as shown here）

function genCharArray(charA, charZ) { 
    var a = [], i = charA.charCodeAt(0), j = charZ.charCodeAt(0); 
    for (; i <= j; ++i) { 
     a.push(String.fromCharCode(i)); 
    } 
    return a; 
} 
$scope.charArray = genCharArray('a', 'z'); // ["a", ..., "z"]

そして、アルファベットの配列を作成します。

<div ng-controller="home as homeCtrl" ng-cloak class="ng-cloak" class="wrapper"> 
    <div ng-repeat="letter in charArray" ng-include="'blocks/' + letter + '.html'"></div> 
</div>

[編集] を使用すると、任意の一般的なリストで作業する場合と、具体的にアルファベットではなく、元の投稿と同じように、配列を使用して、何にでも初期化するだけです。ここ

$scope.charArray = ['lemon', 'tree', 'apple'];

ポイントは、あなたが好きな任意の数のオブジェクトを反復処理し、動的に適切ng-include要素を作成するng-repeatを使用しています。

出典

2016-04-05 12:04:47 AlexD

申し訳ありません。私はアルファベットをファイル名のプレースホルダとして使用しました。これは、そのケースでは動作するかもしれませんが、私は持っているものではありません。 – ziraak

私の答えを編集しましたが、好きなもので配列を初期化するだけです。 – AlexD

にはngIncludeを使用した複数の部分が含まれています

答えて

関連する問題