小编Squ*_*pes的帖子

Angular4:jQuery和angular2-materialize在路由导航后不起作用

用angular-cli创建了一个角度4项目.在angular-cli.json文件中导入css和js.

"styles": [
    "../node_modules/materialize-css/dist/css/materialize.css",
    "styles.css"
],
"scripts": [
    "../node_modules/jquery/dist/jquery.js",
    "../node_modules/hammerjs/hammer.js",
    "../node_modules/materialize-css/dist/js/materialize.js",
    "../src/assets/js/init.js"
],
Run Code Online (Sandbox Code Playgroud)

init.js具有以下功能

(function($) {
    $(function() {
        $('.slider').slider();
        $('.button-collapse').sideNav();
        $('.carousel').carousel();
        // $('.carousel.carousel-slider').carousel({fullWidth: true});
        $('.carousel').carousel({
            dist: 0,
            shift: 0,
            padding: 20,
        });

    }); // end of document ready
})(jQuery);
Run Code Online (Sandbox Code Playgroud)

在app.module.ts中导入MaterializeModule从'angular2-materialize'导入{MaterializeModule};

当我们第一次登陆页面或刷新时,滑块按预期工作.

问题:当我们使用router-link导航时,页面导航正确但javascript函数没有被调用.

从主页路由 <a routerLink="/blog/abc-1">Blog</a>

我试过:`blog.component.ts

import { Component, OnInit } from '@angular/core';
import { MaterializeModule } from 'angular2-materialize';

import * as $ from 'jquery';

import * as Materialize from 'materialize-css';


declare let Materialize : any;

@Component({
  selector: 'app-blog',
  templateUrl: …
Run Code Online (Sandbox Code Playgroud)

jquery materialize angular

6
推荐指数
1
解决办法
1519
查看次数

标签 统计

angular ×1

jquery ×1

materialize ×1