Question

我试图找出如何使用angular2在html中显示对象。在ng1中，我分配了一个变量，并在html和bingo中支持变量名称！现在我似乎无法显示任何数据。

这是我的简单方法调用：

  onSubmit(value: oSearch): void {
    console.log('you submitted value: ', value);
    Meteor.call('methodName',value.type,value.year,value.idNumber, function(error,result) {
      if (error) {
        console.log('failed', error);
      } else {
        this.oResult = result[0];
        console.log('successful call', this.oResult);
      }
    })
  }

对象被打印到控制台。但是我无法通过使用：

来渲染它

{{oResult}}

使用

声明oResult

oResult:Object;

ts和ng2全新。

更新

好的，我尝试了NgZone，但那并没有奏效。我得到的行为我真的不明白。

} else {      
console.log('successful call', result[0].topItem);
this.oResult = result[0];
console.log('successful call', this.oResult);

两个console.logs都正确打印对象，但oResult显示为[object Object]

如果我改为：

this.oResult.topItem = result[0].topItem

然后我抛出一个Meteor错误，第二个console.log没有打印。错误是：

Exception in delivering result of invoking 'methodName': TypeError: Cannot set property 'topItem' of undefined

我的服务器方法与ng1完美配合。我尝试过http的同步版本，但没有导致行为发生变化。

也许有人知道我可以使用更新的angular2-meteor进行http方法调用的教程演示吗？

Answer 1

如果字段由在Angulars区域外运行的代码更新，则Angular无法识别值更改。注入zone: NgZone并在zone.run(...)中运行代码。在Angular中初始化库也可能足以使其使用由Angular修补的异步API，通知Angular可能的更改。

  constructor(private zone: NgZone) {
  }

  onSubmit(value: oSearch): void {
    console.log('you submitted value: ', value);
    Meteor.call('methodName',value.type,value.year,value.idNumber, function(error,result) {
      if (error) {
        console.log('failed', error);
      } else {
        zone.run(function() {
          this.oResult = result[0];
          console.log('successful call', this.oResult);
        });
      }
    });
  }

另请参阅Service events do not affect template correctly示例。

ng2在html中显示对象

1 个答案: