基础6与角6积分不工作

Question

我试图使用一些基础组件，如模型和手风琴菜单，但不幸的是，这是行不通的。

    import { Component, OnInit} from '@angular/core';
import { MenuItems } from '../../shared/menu-items';
import { Foundation } from 'node_modules/foundation-sites/js/foundation.core';
declare var $:any;


@Component({
  selector: 'app-admin',
  templateUrl: './admin.component.html',
  styleUrls: ['./admin.component.scss']
})
export class AdminComponent implements OnInit {

  isShrinkMedium: Boolean = true
  menuItems;
  constructor() { }

  ngOnInit() {
    Foundation.addToJquery($);
    $(document).foundation();
    this.menuItems =  new MenuItems().getAll();
   }

这是我的组件，我收到控制台中的折叠错误。

​

​

当我点击我在图片中圈出的位置时，我得到了下面这个。

​

​

由于这一点，所有的基础组件都没有工作，但一切都很好，我使用的是一个较低的版本，版本4。希望有人知道这里发生了什么。

Answer 1

尝尝这个

cd path_project

npm install jquery
npm install foundation-sites

npm install @types/jquery --save-dev
npm install @types/foundation-sites --save-dev

如果不起作用！

复制这个

 interface JQuery {
     foundation(method?: string | Array<any>, ...args: any[]): JQuery;
  }

从…

/path_project/node_modules/foundation-sites/dist/js/foundation.d.ts

然后粘贴进去

/path_project/node_modules/@types/jquery/index.d.ts

把它设置在最后一行

在……里面

/path_project/src/polyadds.ts

设置===>

    /***************************************************************************************************
 * JQuery
 */
import 'jquery';

现在在您的代码中您可以设置

import { Component, OnInit } from '@angular/core';
// import 'jquery'; // set this in polyfills.ts
//// import * as $ from 'jquery';
// import { Foundation } from 'foundation-sites/dist/js/foundation.min';


@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
  title = 'ex4';
  ngOnInit() {
      // Foundation.addToJquery($);
    $(document).foundation();
  }
}

别忘了

将"css“和"js”添加到

/path_project/angular.json

像这样

   "styles": [
      "src/styles.css",
      "node_modules/foundation-sites/dist/css/foundation.min.css"
    ],
    "scripts": [
      "node_modules/jquery/dist/jquery.min.js",
      "node_modules/foundation-sites/dist/js/foundation.min.js"
    ]

重新启动

ctr+c


ng serve