角度插值导致AOT编译错误

时间:2017-04-29 15:32:59

标签: angular typescript angular2-forms angular2-aot

我正在尝试编译我的应用程序,但AOT因Angular 2形式的Angular插值而抛出以下错误:

  

“FirebaseObjectObservable”类型中不存在属性“地址”。

以下是我的HTML格式的相关摘录:

        <div class="col-md-6">
      <div class="form-group row clearfix" [ngClass]="{'has-error': (!address2.valid && address2.dirty), 'has-success': (address2.valid || address2.pristine)}">
        <label for="inputAddress2" class="col-sm-3 control-label">Address 2</label>
        <div class="col-sm-9">
          <input [formControl]="address2" value="{{building?.address?.address2}}" type="text" class="form-control" id="inputAddress2" placeholder="Address 2">
        </div>
      </div>
    </div>

以下是我的组件中的相关代码段:

  public buildings: FirebaseObjectObservable<any>;
  ....
    this.buildings = this.af.database.object(this.fbs.bLocation + 
      this.buildingId + '/');
      this.buildings.subscribe((items) => {
        this.building = (items);
      });

现在我不确定我应该如何区别地执行此操作,因为在使用Webpack和JIT编译进行编译之前这很好用,但是一旦我使用AOT构建它以进行生产,它就会抛出此错误。我试图在表单上使用插值的原因是因为我试图从数据库中提取用户的设置,并允许它们更新。

1 个答案:

答案 0 :(得分:1)

此错误来自 building 类型未在我的组件中声明。

通过导入我的构建数据类型并在代码中声明它来解决了这个问题:

building: Building = {
  $key: null,
  details: {
    name: null,
  },
  address: {
    address1: null, address2: null, city: null, state: null, zipcode: null, country: null,
  },
  contact: {
    name: null, email: null, phone: null,
  },
};

感谢@JB Nizet提醒我,我忘了宣布它。