Question

    @Component({
      selector: 'my-content',
      templateUrl: `./app/content/content.components.html`
    })
    export class ContentComponent  { 
      _clickLectre: any;
      _temoobj:any;
      private subscription: Subscription;
      constructor(private commonService: CommonService, private dataService: DataService ) {
      }
      ngOnInit() {               
        this.subscription = this.commonService.notifyObservable$.subscribe((res) => {
          if (res.hasOwnProperty('option') && res.option === 'call_Lecture') {                         
                console.log("call"+res.items);            
                this._clickLectre=res.items;
                console.log("call"+this._clickLectre.facultyname);               
          }
        });
      }
      ngOnDestroy() {
        this.subscription.unsubscribe();
      }

    }

HTML

   <tr  *ngIf="_clickLectre">
    <td>Faculty Name : </td>
    <td>{{_clickLectre.facultyname}}</td>
    <td>X</td>
    <td>X</td>
    <td>End Time :</td>
    <td>X </td>
    <td> Present: </td>
    <td>X </td>
   </tr>

我使用commonService用于将内容从一个组件传输到另一个组件。

在控制台上打印的this._clickLectre.facultyname值以上，但未在html页面上反映

为什么数据绑定不起作用是什么问题？

提前致谢

Answer 1

由于_clickLectre是异步定义的，您应该使用安全的导航操作符（?）

<td>{{_clickLectre?.facultyname}}</td>

Answer 2

您可以在初始化状态下将变量设置为空对象。

@Override 
public Observable<List<Assignment>> query(Specification specification) {
    return Observable.create(subscriber -> {
            final SqlSpecification sqlSpecification = (SqlSpecification) specification;

            final SQLiteDatabase database = mOpenHelper.getReadableDatabase();
            final List<Assignment> assignments = new ArrayList<>();

            try { 
                final Cursor cursor = database.rawQuery(sqlSpecification.toSqlQuery(), new String[]{});

                for (int i = 0, size = cursor.getCount(); i < size; i++) {
                    cursor.moveToPosition(i);

                    assignments.add(mToAssignmentMapper.map(cursor));
                } 

                subscriber.onNext(assignments);

                cursor.close();
            } finally { 
                database.close();
                subscriber.onCompleted(); 
            } 
    }
}

数据绑定无法在angular2

2 个答案: