javascript - 解析 Angular 组件模板文件中的对象

标签 javascript angularjs

我的 address.component.ts 中有一个对象,如下所示:

address : any;

这是从后端填充到地址中的数据

{street1: "abc"
 city: "some state"
 country: "some country"
}

我在调用服务后获取此数据。

我的模板文件如下:

<h1>{{address}}</h1>

在浏览器上显示如下:

[Object object]

我想显示整个地址对象,而不是这个。我知道我能做到

<h1>{{address.street1}}</h1>
<h1>{{address.state}}</h1>
<h1>{{address.country}}</h1>

但我不想这样做,因为后端可能会更改地址中的字段(例如添加一个字段)。有什么方法可以在浏览器上显示 address 对象中的所有数据,而不是仅显示 [Object object]

最佳答案

使用

<h1 ng-repeat="(key, value) in address">{{value}}</h1>

ng-repeat 根据元素中的条件重复元素。

更多信息请参见ng-repeat documentation .

关于javascript - 解析 Angular 组件模板文件中的对象,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48446109/

相关文章:

javascript - 如何从 Google map 中删除多边形

javascript - AngularJS - 在 POST 请求的正文中发送数据

javascript - 如何使用 angular ui bootstrap 在 pop 上显示 html?

javascript - 如何使用 AngularJS 为每个页面从 JSON 文件加载不同部分的数据?

javascript - 修复了 Bootstrap 响应表和 AngularJS 的第一列

unit-testing - 测试使用模板的指令

javascript - 使用切换和项目属性的 polymer "dom-if"

IIFE 内声明的 Javascript 链式变量赋值获得全局可见性?

javascript - HTML Canvas : Fill() not working with no errors in console

javascript - 在作为 prop 传递的 vue 组件中使用模板