Question

我正在尝试在完成异步功能时从Angular 4控制器调用一个jquery函数，但我找不到。

我的控制器：

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

＆＃13;

///<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! ^_^");
  }
}

＆＃13;

从控制器Angular4

1 个答案: