AngularJS表达式用法

-1

我建立一个简单的网页，我得到一些JSON数据是这样的：AngularJS表达式用法

{ 
"Persons" : [{ 
     "Initials" : "jd", 
     "Name" : "Jhon Doe", 
     "Email" : "[email protected]", 
     "Title" : "Some title", 
     "Phone" : "+999 999 999", 
     "PictureUrl" : "personimages/jd.jpg" 
    }, { 
     "Initials" : "jb", 
     "Name" : "James Bond", 
     "Email" : "[email protected]", 
     "Title" : "Agent", 
     "Phone" : "+007 007 007", 
     "PictureUrl" : "personimages/jb.jpg" 
    }, ... 
    ], 
"DistLists" : [{ 
     "ContainedPersons" : ["jd", "jb", ...], 
     "Title" : "Some Title" 
    }, { 
     "ContainedPersons" : ["jd, "hp, ..."], 
     "Title" : "Some other Title" 
    }, ... 
] 
}

所以我创建了一个网页，您可以选择不同的“组”，在“ DistLists”。
并且通过选择例如“Some Title”组我想要采用“ContainedPersons”数组，并循环“Persons”并显示“ContainedPersons”数组中的所有“Persons”的信息。

我的HTML看起来是这样的：

<!DOCTYPE html> 
<html ng-app="WhoIsWho2"> 
    <head> 
     <script type="text/javascript" src="app/gemApp.js"></script> 
    </head> 

    <body ng-controller="WhoIsWho2Controller as wiw2"> 
     <div class="text-center" ng-controller="myCtrl"> 
     <select ng-model="selectedItem" ng-options="item as item.Title for item in distlist"></select> 
     <p>{{selectedItem.ContainedPersons}}</p> 

     <table align="center" border="1"> 
      <tr ng-repeat="ini in selectedItem.ContainedPersons"> 
       <td> 
        <p ng-repeat="employ in wiw2.employees | filter: {Initials:'{{ini}}'}">Hejsa Test 2 {{employ.Name}} </p>       
       </td> 
      </tr> 
     </table> 
     </div> 
    </body> 
</html>

和含有角我的JavaScript文件看起来是这样的。

(function() { 
    var app = angular.module('WhoIsWho2', []); 

    app.controller('WhoIsWho2Controller', function() { 
     this.employees = persons; 
    }); 

    app.controller('myCtrl', function($scope) { 
     $scope.distlist = distlist; 
    }); 
})();

JavaScript文件中的人员和distlist是我的数据。（本地现在，但应该来自JSON文件）

我的问题是，我不允许在我的<p>元素中使用ng中的{{ini}}。

是否有另一种方法来实现这一目标？
或者也许用另一种设计？

所有帮助表示赞赏。

来源

2016-09-27 Rasmus Carlsen

你只尝试INI不是{{INI}}？你在角标签里面，没有必要使用胡须。 –

用详细信息创建一个plnkr –

@LucasCosta谢谢！这有窍门，我完全忽略了它！ –

尝试这样的：

<tr ng-repeat="ini in selectedItem.ContainedPersons"> 
    <td> 
     <p ng-repeat="employ in wiw2.employees | filter: {Initials:ini}">Hejsa Test 2 {{employ.Name}} </p>       
    </td> 
</tr>

来源

2016-09-27 12:17:40

是的，这工作。谢谢。 –

Hi @RasmusCarlsen如果此答案已解决您的问题，请点击复选标记，考虑[接受它]（http://meta.stackexchange.com/a/5235/237701）。这向更广泛的社区表明，您已经找到了解决方案，并为答复者和您自己提供了一些声誉。没有义务这样做。 –

AngularJS表达式用法

回答

相关问题