Question

我想显示此列表，但我无法访问town属性。

我怎么能修复我的pb？

{ "id":"1",
      "name":"Hotel Ritz",
      "address":[
        {
         "country":"France",
         "town":"Paris",
        }
      ],
      "visited":true
    }
    { 
      "id":"2",
      "name":"The Plaza",
      "address":[
        {
         "country":"USA",
         "town":"New York"
        }
      ],
      "visited":false
    }

显示复选框以更改所访问属性值的最佳方法是什么？我尝试了这段代码，但它不起作用：

 <ul class="hotel-list">  
      <li ng-repeat="hotel in hotels">
        <span>{{hotel.name}}<span>
      </li> 
      <ul>
        <li *ngFor="let towm of hotel.address">{{address.town}}</li>
     </ul>
 </ul>

Answer 1

ng-repeat是angularjs语法。 *ngFor是angular语法。您不能混合/匹配这些，为您正在使用的框架选择正确的语法。
在HTML中，您引用的towm应为town
如果您在let addressPart中使用ngFor，则可以直接在该元素的范围内引用该内容。
您的HTML语法不正确。 ul包含li，而不包含其他ul元素。您还有一些元素没有匹配的结束标记。

<ul class="hotel-list">  
    <li *ngFor="let hotel of hotels">
        <span>{{hotel.name}}<span>
        <br/>
        Visited: <input type="checkbox" [(ngModel)]="hotel.visited" />
    </li> 
    <li>
        <ul>
            <li *ngFor="let addressPart of hotel.address">{{addressPart.town}}</li>
        </ul>
    </li> 
</ul>

将值visited属性绑定到checkbox是angular的核心概念。在上面的例子中，我添加了2路绑定。您可以在Template Syntax文档中查看更多内容。

总体而言，角度文档编写得非常好，并且具有从tutorials到fundamental concepts到深度API documentation的所有内容。我建议你看看。

如何以数组角度4显示数组

1 个答案: