jquery - 从 Controller Angular4 调用 jQuery 函数

Question

当异步函数完成时，我尝试从 Angular 4 Controller 调用我的 jquery 函数，但我找不到如何调用。

我的 Controller :

import { Component, OnInit, ViewEncapsulation } from '@angular/core';
import { MyService } from '../my.service';

declare var $: any;

@Component({
  selector: 'slider',
  encapsulation: ViewEncapsulation.None,
  templateUrl: './slider.component.html',
  styleUrls: ['./slider.component.css']
})
export class SliderComponent implements OnInit {

  banners: Promise<String[]>;

  ngOnInit(): void {
    this.banners.then(function(result) { 
            // HERE MUST BE MY CODE FUNCTION
    });
  }

  constructor(private myService: MyService) {
        this.banners = this.myService.getBanners();

    }
}

还有我的模板:

<div id="slider1_container" style="position: relative; margin: 0 auto; width:600px; height:300px; left:0px; top:0px;">

        <!-- Slides Container -->
        <div u="slides" style="cursor: move; position: absolute; left: 0px; top: 0px; width: 600px; height: 300px;
            overflow: hidden;">
            <div *ngFor="let b of banners | async">
                <img u="image" src="{{ b }}" />
            </div>
        </div>

        <!-- Trigger -->
        <div class="slideshow-block">

            <div style="margin: 0 4px; display: none; ">
                <input id="stTransitionName" readonly type="text" style="width:200px;height:22px;" />
            </div>
            <div style="display: none; margin: 0 4px;">
                <input id="stTransition" readonly type="text" style="width:100%;height:22px;" />
            </div>

            </div>
    </div>

当我的所有横幅加载完毕后，我需要调用 jquery 函数来实现移动效果。之前，我仅使用 HTML 和 jquery 在 window.ready 函数上调用该函数，但现在这没有用，因为它是一个异步函数。

谢谢。

Answer 1

///<reference path="../typings/jquery/jquery.d.ts" />

import {Component, AfterViewInit} from 'angular2/core';

@Component({
  selector: 'your-app',
  templateUrl: './app.component.html'
})

export class AppComponent implements AfterViewInit {
  ngAfterViewInit() {
    // Your jQuery code goes here
    $('#yourElement').text("Hello! ^_^");
  }
}