如何在DOM中與Angular 4應用程序進行通信？

Question

我嘗試addItems但是方法調用，我是得到錯誤：

Uncaught TypeError: this.addItems is not a function

我用角4 jQuery和fullpage.js庫。

頁面content.component.ts

import { Component, OnInit } from '@angular/core'; 
import { MyDataService } from './my-data.service'; 
import * as $ from 'jquery'; 
import 'fullpage.js'; 

@Component({ 
    selector: 'page-content', 
    providers: [MyDataService], 
    templateUrl: './page-content.component.html', 
    styleUrls: ['./page-content.component.css'] 
}) 
export class PageContentComponent implements OnInit { 
    single_post = ''; 
    posts = []; 
    constructor(private newService: MyDataService) { 
     this.addItems(0, this.no_of_post); 
    } 
    ngOnInit() { 
     $(document).ready(function() { 
     if($('html').hasClass('fp-enabled')){ 
       $.fn.fullpage.destroy('all'); 
      } 
     $('#fullpage').fullpage({ 
      onLeave: function(index, nextIndex, direction){ 
       const start = this.no_of_post; 
       this.no_of_post += 1; 
       this.addItems(start, this.no_of_post); 
      } 
     }); 
     }); 
    } 

    addItems(startIndex, endIndex) { 
    for (let i = startIndex; i < this.no_of_post; ++i) { 
     this.newService.fetchData().subscribe(data=>{ 
      this.single_post = data[i]; 
      this.posts.push(this.single_post); 
     }); 
    } 
    } 
} 

Answer 1

我建議你到這個調用構造函數從移動ngOnInit（）

constructor(private newService: MyDataService) { 
    this.addItems(0, this.no_of_post); 
} 

而且事情是對this點的類。您沒有該類中的房產no_of_post。

你也有這個字符串

onLeave: function(index, nextIndex, direction) {

使用箭頭功能

onLeave: (index, nextIndex, direction) => {